CODEWITHSUNDEEP
htmlcssfirefox
user3440078
user3440078

Reputation:

CSS loading on Firefox but it's not rendering

index.html and style.css are on my local machine to practice coding.

Chrome and Safari are rendering the CSS correctly but FireFox 29 is not. Firefox recognize the css file but it's not rendering it. I've tried on a different machine and still have the same issue.

I've already validated my code and there were no errors. Am I missing any tag that is preventing this from rendering in Firefox? 

<!DOCTYPE html>
<html>
<head>
<meta charset= "utf-8">
<link rel="stylesheet" type="test/css" href="style.css">
<title>Welcome!</title>
</head>

<body>

<div id="pagewrap">

<!-- Top Head of My Page -->
<div id="header">
    <nav id="nav">
        <a href="./index.html" id=logo><img src="#" alt="yo"></a>
        <div id="socialnetwork">
            <a href="#" id="linkicon"><img src="./Social_Icons/Linkedin.png" alt="LinkedIn"></a>
            <a href="#" id="fbicon"><img src="./Social_Icons/facebook.png" alt="FB"></a>
            <a href="#" id="igicon"><img src="./Social_Icons/Instagram.png" alt="InstaGram"></a>
            <a href="#" id="twittericon"><img src="./Social_Icons/Twitter.png" alt="Twitter"></a>
            <a href="#" id="skypeicon"><img src="./Social_Icons/Skype.png" alt="Yelp"></a>
            <!-- Icons from Dribble by Dawid Dapszus https://dribbble.com/dashoo-->
        </div>
        <!-- End of Social Network Links-->
    <ul>
        <li><a href="./index.html" class="navlink">Home</a></li>
        <li><a href="./aboutme.html">Portfolio</a></li>
        <li><a href="./resume.html">Resume</a></li>
        <li><a href="./aboutme.html">About Me</a></li>
        <li><a href="./contact.html">Contact </a></li>
    </ul>
    </nav>
</div>

</div>
<!--End of Page Wrap -->
</body>
</html>

body {
font-family:'Century Gothic', sans-serif;
}

a {
text-decoration: none;
}

#pagewrap {
width:950px;
margin: 0 auto;
}

#socialnetwork {
padding-top: 100px;
float:right;
 }

#socialnetwork img{
height:30px;
}

#nav ul{
text-align: left;
border-bottom: groove;
}

#nav li{
margin:0 15px 0 0;
display: inline;
}

#nav li a:link{
color:#868686;
}

#nav li a:visited{
color:#868686;
}

#nav li a:hover{
color:#324EDC;
}

#nav li a:active{
color:#324EDC;
}

Upvotes: 0

Views: 203

Answers (2)

InventorX
InventorX

Reputation: 378

You are typing the wrong word in Link tag attribute value, you are typing "test/css" instead of "text/css"

Your Tag:

<link rel="stylesheet" type="test/css" href="style.css">

Updated Tag:

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

Upvotes: 7

sinisake
sinisake

Reputation: 11338

type="test/css"

Shouldn't it be: text/css?

Upvotes: 2

Related Questions