CODEWITHSUNDEEP
htmlcssstyles
Michael Benneton
Michael Benneton

Reputation: 325

CSS Internal vs External Style Sheets

I'm creating a webpage and I began using the style tag at the top:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Front Page</title>
    <link rel="stylesheet" type="text/css" href="CSS/Styles.css" /> 

    <style type="text/css">
    </style>
</head>
<body>
</body>
</html>

I want all my graphics design to be in my Styles.css but for some reason, it just doesn't work. When I add something like:

div.box {
        margin:0 auto;
        width:500px;
        background:#222;
        position:relative;
        left: 50px;
        top: -200px;
        height: 100%;
        border:1px solid #262626;
        padding: 0 5px 5px 0;
    }

To design this element:

<div class="box"></div>

It works when I put it in the tag, above the document, but not if I put it in the CSS file. It wasn't a problem before but now I've been adding everything to the style tag and it's getting really long (150 lines!). I want to move it all to the css file so my main page has less to scroll through. But I don't understand why the graphical changes just won't apply if put in the CSS file. Any ideas?

Upvotes: 0

Views: 589

Answers (2)

Madara&#39;s Ghost
Madara&#39;s Ghost

Reputation: 175028

If your CSS file's path is alright, there are several things that may have happened:

  • It's possible that you simply need to clear your cache. CTRL+F5 usually does the trick. New users coming to your site won't need to do that.
  • It's possible that you've had a typo, or forgot to close a statement above with ;, check for that.
  • It's possible that this is a specificity issue, i.e. another rule, more specific is overriding your rules. Read about it here.

Upvotes: 1

jimp
jimp

Reputation: 17477

Are you on a case-sensitive file system (Linux)? Your path to CSS/Styles.css needs to be exactly right. Also, it is relative to the page and <basepath/>. Try using an absolute URL to rule out a path issue.

If you don't have a path issue, then you might have accidentally made a typo in the CSS file somewhere, causing your rule to be missed.

If your CSS file is good, then perhaps your browser has an old version cached. Have you tried clearing your cache?

Upvotes: 0

Related Questions