CODEWITHSUNDEEP
htmlcss
Steven
Steven

Reputation: 19425

Why is there underline on my links after css "reset"?

I've created a fiddle here: http://jsfiddle.net/zY3rL/1/

In my CSS I reset the link styling by doing the following:

@import "http://necolas.github.io/normalize.css/3.0.0/normalize.css"
@import "http://fonts.googleapis.com/css?family=Open+Sans:400,300"

a { text-decoration: none; }
ol,ul { list-style: none; margin: 0; padding: 0; }

Why then does the links in this code still have underline?

<ul class="menu">
    <li>
        <a href="">Invoicing</a>
        <ul>
            <li><a href="">Create an Invoice</a></li>
            <li><a href="">View sent Invoices</a></li>
            <li><a href="">View rejected Invoices</a></li>
        </ul>
    </li>
</ul>

Upvotes: 0

Views: 1350

Answers (1)

Kelderic
Kelderic

Reputation: 6697

You need ; behind each @import line. Since there were none, the first line of CSS wasn't being applied.

Working Fiddle

Original:

@import "http://necolas.github.io/normalize.css/3.0.0/normalize.css"
@import "http://fonts.googleapis.com/css?family=Open+Sans:400,300"

a { text-decoration: none; }

CSS continues...

Fixed:

@import "http://necolas.github.io/normalize.css/3.0.0/normalize.css";
@import "http://fonts.googleapis.com/css?family=Open+Sans:400,300";

a { text-decoration: none; }


CSS continues...

Note the ; behind each @import line.

Upvotes: 5

Related Questions