Bootstrap - CSS file not loading

Question

I'm having some issues regarging Bootstrap, I'm following a basic tutorial and all works however the CSS file is not loading properly. I've searched around on StackOverflow however none of it worked. My HTML file is in the exact same folder as the css folder is. This is my code :

<!DOCTYPE html>
<html>

<head>
    <meta charset=”utf-8”></meta>
    <title>This is a title, oh-ehm-GHEE</title>
    <link rel=”stylesheet” href=”css/bootstrap.css” type=”text/css”/>
</head>

<body>
    <div class="”container”">
        <h1><a href="”#”">Bootstrap Site</a></h1>

        <div class="navbar">
            <div class="navbar-inner">
                <div class="container">
                    <ul class="nav">
                        <li class="active"><a href="#">Home</a></li>
                        <li><a href="#">Projects</a></li>
                        <li><a href="#">Services</a></li>
                        <li><a href="#">Downloads</a></li>
                        <li><a href="#">About</a></li>
                        <li><a href="#">Contact</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src=”js/bootstrap.js”></script>
</body>

</html>

what does your file/folder structure look like? Likely a path issue to your files — Jon Harding
– Jon Harding, Commented Sep 18, 2013 at 20:04
Another thing is you're not closing your container div. Indenting properly makes it easier to see this. — KyleMit
– KyleMit ♦, Commented Sep 18, 2013 at 20:13
what is the network tab of the Chrome Inspector (or firebug) saying? Do you get a 404 on the css file? — Pevara
– Pevara, Commented Sep 18, 2013 at 20:32

Matt Sieker · Accepted Answer · 2013-09-18 20:29:13Z

3

It looks like fancy quotes snuck into your code, as seen on these two lines:

<div class="”container”">
<h1><a href="”#”">Bootstrap Site</a></h1>

Note the difference between the inner and outer quotes. The same quotes are in your meta tag, the link for the stylesheet, and your final script tag.

Replace the fancy quotes with standard quotes, and as long as your directory structure is right, it should work.

edited Sep 18, 2013 at 20:29

answered Sep 18, 2013 at 20:06

Matt Sieker

9,7052 gold badges27 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Boelens Over a year ago

Wow, that was a silly mistake of me! I replaced all the fancy quotes, but sadly it STILL does not show up properly. To give you an idea, this is how it looks : puu.sh/4uzLk.png

Boelens Over a year ago

Actually, nevermind! Solved it! I forgot to change the url to css/bootsrap.css . Do I have to mark this question solved somehow?

zazvorniki · Accepted Answer · 2013-09-18 20:02:57Z

1

If your html is the same folder as you css? Then there is no css folder or your html is within the css folder am I right?

Try something like this

<link rel=”stylesheet” href=”bootstrap.css” type=”text/css”/>

answered Sep 18, 2013 at 20:02

zazvorniki

3,62023 gold badges80 silver badges128 bronze badges

2 Comments

Boelens Over a year ago

Yes, it is. I have the folder htdocs/projectname where my HTML file is, and the css folder. I've tried your line of code but it's still the same. The code itself works fine but the CSS doesn't display. This is on Chrome, newest version.

zazvorniki Over a year ago

did you open up your console and see whats happening?

Mark Busnelli Jr · Accepted Answer · 2013-09-18 20:05:26Z

0

Did you download the zip file from http://getbootstrap.com/? Typically the CSS, ICO and JS files are in "assets". So you need to upload those files and reference those files in your HTML. Make sure you have the files uploaded and are referencing correctly.

Also be sure you are referencing the CDN version of jQuery like so:

 <script src="//code.jquery.com/jquery.js"></script>

Using the //code.jquery.... will ensure that your JS will always be up to date and if you ever use "https" on your website your JS files will be secured as well.

Hope that helps.

answered Sep 18, 2013 at 20:05

Mark Busnelli Jr

4353 silver badges10 bronze badges

Collectives™ on Stack Overflow

Bootstrap - CSS file not loading

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related