abedzantout
abedzantout

Reputation: 832

Why isn't my css applying?

I tried using different editors and IDEs (netbeans and visual studio code) along with different browsers (firefox developers edition), yet, I can't seem to get the css sheet to apply to the main html file. The style sheet editor is saying that there is no style sheet attached to the html file Here's the html file:

<!DOCTYPE html>
<html>
    <head>
        <title>The Animal Game</title>
        <meta charset="utf-8"/>
        <link href="animalgame.css" type="text/css" rel="stylsheet" />
        <script src="animalgame.js" type="text/javascript"></script>
    </head>

    <body>
        <h1>The Animal Game</h1>
        <p>Think of an animal, then let me guess it!</p>
        <div id="container">
            <fieldset>
                <legend>Questions</legend>
                <p id="questions"></p>
            </fieldset>
            <fieldset id="answer">
                <legend>Answer</legend>
                <button id="yes">Yes</button>
                <button id="no" >No</button>
            </fieldset>
        </div>

    </body>
</html>

CSS style sheet:

body {
    font: 12pt "Century Gothic", "Helvetica", "Arial", sans-serif;
}

button {
    font-size: 20pt;
    font-weight: bold;
    margin: 15px auto;

}
#container{
    margin: auto;
    width: 520px;
}
fieldset {
    background-color: #F0F0F0;
    float: left;
    height: 150px;
    margin-right: 15px;
    text-align: center;

}
h1, p {
    text-align: center;
}
#questions {
    font-size: 16pt;
    text-align: center;
    width: 300px;
}

EDIT: problem solved! There was a typo. Thank you for all hints

Upvotes: 0

Views: 88

Answers (1)

Gadget Blaster
Gadget Blaster

Reputation: 761

You have a typo in rel="stylsheet" it should be stylesheet

Upvotes: 7

Related Questions