Hi guys so a site I've been working on is acting up and has randomly re-positioined itself wierdly on the top bar and I have no idea why. I thought everything was fine before, however recently I saw the site and it just so happened that theres a wierd space at the top of the page between the nav bar and the window url. Can someone inspect it and help me figure out whats causing this and if there would be a quick or easy fix. The site is www.omegadesignla.com and any help would be appreciated, thanks.
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Omega Design | LA</title>
<meta name="description" content="Web development and printing services serving the greater los angeles area">
<meta name="keywords" content="web development, printing, graphics design, los angeles, santa clarita">
<link rel="stylesheet" href="stylesheets/app.css" />
<link rel="stylesheet" href="stylesheets/foundation-icons.css" />
<link rel="stylesheet" href="css/normalize.css" />
</head>
<body>
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name">
<span><a href="index.html"><img class="logo" src="img/logofinal.png"></a><span>
</li>
<li class="toggle-topbar menu-icon">
<a href="#">Menu</a>
</li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li><a href="#about">About us</a></li>
<li><a href="#" data-reveal-id="myModal">Contact us</a></li>
<li class="has-dropdown">
<a href="#">Services</a>
<ul class="dropdown">
<li><a href="services.html#printing">Print Media</a></li>
<li><a href="services.html">Web Development</a></li>
<!-- <li><a href="services.html">Promotional Items</a></li> -->
<!-- <li class="active"><a href="#">Active link in dropdown</a></li> -->
</ul>
</li>
</ul>
</section>
</nav>
<div class="container">
<header>
There's a line " "
right after the body
tag. Remove it and this should reposition the navigation bar correctly.
I just realized that you can only see this if you 'inspect element' in development tools.
If you can edit the page's source, make sure that the <nav class="top-bar" data-topbar>
comes right after <body>
. Right now, there is a blank line (line 16).