Try validate markup and CSS, fix the errors that matter.
Markup Validator
http://validator.w3.org/
CSS Validator
http://jigsaw.w3.org/css-validator/
Okay, I put it through the validators and nothing showed up that would cause this shift. I noticed it’s only happening with Safari and Chrome.
Any other ideas?
Thanks.
There are some errors that should be corrected…
But it looks like the problem is that you need a “clear” on this element:
<div id="container">
That didn’t work either, WPyogi. But I put a clear: both; on some other divs and it stopped shifting up and down. Now it’s not lining up across the logo.
The CSS/HTML errors I have shouldn’t effect layout… right?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Now it’s not lining up across the logo.
What isn’t?
The Logo and the contact info and menu should be in one row. But sometimes sometimes it shifts, mostly when you first load the page. I think, for the life of me, why it’s doing that.
You have no CSS for those elements – why is that? or do you have CSS errors that are breaking the CSS.
Possibly add these – and then use a browser tool like Firebug to sort out the details:
#main-wrapper img {
float: left;
}
#inner-header-wrapper {
float: right;
}
#container {
clear: both;
}
sometimes it shifts, mostly when you first load the page. I think, for the life of me, why it’s doing that.
Possibly due to slow loading of CSS or browser caching or site caching.