Solution 1 :

I believe what you are describing is happening because there is internal/embedded CSS within the HTML on that particular page in the <head> section.

  <style type="text/css">
    1 ...
    2 ...
    36 a...{
         color: #72c02c;

You will need to remove or modify that to prevent it from overriding your external stylesheet (style.css).

Problem :

I have this website where there is a green band displayed at the very top.
Below an abstract from the html code:

<div id="wrapper">
    <!-- start header -->
    <div class="site-top"> !this makes the green band at the top!
        <div class="container">
            <div class="pull-right">
                <a href="http://localhost/dimi_test/admin">  ! this element is displayed as green text!
                 <i class="fa fa-cog"></i> Dashboard

My problem is that the background of the <div class="site-top"> is green and the font colour of the <a> element is the same green, making it invisible.
I tried to find out in which style sheet the <a> element is defined, so I opened google devtools. This is the result:

screenshot Google devtools

It seems the element is defined in .(index):36, in the style sheets that are in the screenshot, the font colour is stricken through. So I do not understand where the DOM element <a> gets its styling from.

Hope my question is more clear now.


Comment posted by TylerH

Can you upload a screenshot of what you are describing in the dev tools here?