I have encountered an issue where I created two identical pages, with one page calling the other through a link. Surprisingly, my top menubar changes significantly between the two pages, even though the HTML/CSS code is exactly the same.
<html> <head>
<link rel="stylesheet" href="css/index.css">
<link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
</head>
<body> <div class="wrapper">
<div id="topmenu" class="navigator">
<ul class="nav">
<li><a href="index.html">(logo)</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="about.html">ABOUT</a></li>
<li class="search">
<input type="text" placeholder="Search...">
</li>
<li class="right"><a href="#">Log In/Sign Up</a></li>
</ul>
</div>
</div>
</body>
</html>
Additionally, I will be sharing my CSS code on JSFiddle to avoid overwhelming this page.
http://jsfiddle.net/wg54d8az/ I am using the same CSS file for both pages. Despite reading some guides, I was unable to resolve the issue. The HTML validator flagged the following mistake: "Line 4, Column 42: Attribute content not allowed on element meta at this point." Unfortunately, I am still unclear about the root cause of the problem.