CSS Is Not Importing into HTML

StackOverflow https://stackoverflow.com/questions/14226169

Frage

I must be tired. CSS isn't importing into HTML. All that shows up is: Test Test Test(On different lines) Also, in the grid CSS all there is is the 920.gs:

<!DOCTYPE html>
<html>
        <head>
            <title>Some title</title>
        <link rel="stylesheet" type="text/css" href="/css/styles.css" />
    </head>
    <body>
        <div class="container_12" id="content">
            <div class="grid_3" id="leftside">
                <h1>Test</h1>
            </div>
            <div class="grid_6">
                <h1>Test</h1>
            </div>
            <div class="grid_3" id="rightside">
                <h1>Test</h1>
            </div>
        </div>
    </body>
</html>

Annnd the CSS:

@import url("http://fonts.googleapis.com/css?family=Days+One&effect=font-effect-fire-                         animation");
@import url("css/grid.css"")

body {
        background-attachment:fixed;
    background-repeat:no-repeat;
    background-color:#7FA8FF;
    background-position:top;
    background-image:url("../images/background.png");
    text-align: center; 
    font-family: 'Days One', sans-serif;
}
War es hilfreich?

Lösung

Try removing the leading slash from your css path:

<link rel="stylesheet" type="text/css" href="css/styles.css" />

This will assume that you have a css folder at the root of your web app, at the same level as the HTML page.

Andere Tipps

Relative URL's in @import are interpreted as being relative to the importing stylesheet. Now, if the style sheet you're showing is "/css/styles.css", @import url("css/grid.css"") (excluding the stray "" at the end) would look for a file /css/css/grid.css which is probably not what you want.

Just guessing, but I think it's

@import url("grid.css")

you need.

I have a similar idea that the leading '/' could be a problem like duffymo. So I would suggest using 

<link rel="stylesheet" type="text/css" href="css/styles.css" />

But as well with that I would remove the include statement from your css file and just put it in the main like:

<link rel="stylesheet" type="text/css" href="css/grid.css" />

It could be that grid is not importing because you are calling a css/grid.css from css/ making css/css/grid.css but I could be wrong; but it doesn't hurt to try.

Check if you can download the CSS that you are trying to import.

I could not get the following CSS 

@import url("http://fonts.googleapis.com/css?family=Days+One&effect=font-effect-fire-animation");
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top