PDA

View Full Version : Page on right, navigation on left w/ Google Chrome



question
Aug 5th, 2010, 03:04 PM
I've been helped here several times before with adding a navigation bar to my site. It finally all worked out. Now, a returning user to my website, found that all the content besides the navigation and header moves the the right when using Google Chrome. It works fine with Firefox, IE, and Safari.

http://a.imageshack.us/img37/7360/navigationerror.jpg

Here's my website for reference, if needed: http://howrsehelper.com

I'm not that good at coding. All I tried to do was enter a <br> code after the navigation coding. xD That worked, but left a blank space between the too. Any suggestions would be grateful.

Kor
Aug 5th, 2010, 03:26 PM
The error is not confirmed. I see nothing wrong in my Chrome 5.0 / Win7

question
Aug 5th, 2010, 03:59 PM
I have the latest Google Chrome download and Windows 7 and it shows as a problem for me..

abduraooft
Aug 5th, 2010, 04:16 PM
Set clear:left; to #main

question
Aug 5th, 2010, 05:28 PM
Still didn't change for Chrome.

SB65
Aug 5th, 2010, 05:48 PM
abduraooft's suggestion seems to work for me.

You might also want to remove that spurious closing </body> tag:


</li></div></body>
<br><div id="main">

although it doesn't seem as if that's causing the issue.

question
Aug 5th, 2010, 07:59 PM
The two users who notified me about it still say it doesn't work. One user is using Safari and it comes up the same as it does with Chrome. I haven't had any trouble with Safari though.

SB65
Aug 6th, 2010, 09:02 AM
Your live page does not have clear:left set on #main.

In Chrome, I see the problem with screenwidth at about 1100px, beyond that it's fine. Get the same problem with Safari4/Win at all resolutions.

question
Aug 6th, 2010, 03:39 PM
Oh, I must have did the wrong thing then..this is what I put:
#restofcontent { /*wrap rest of content of the page inside this div*/
clear: main;
}

Should I have moved the whole code?

SB65
Aug 6th, 2010, 06:39 PM
What you need in your style.css is:


#main{clear:left}

or you could just enter it in your html:


<div id="main" style="clear:left">

question
Aug 7th, 2010, 02:58 AM
Works on Safari, still not on Google Chrome. I probably entered the code wrong again. :(

SB65
Aug 7th, 2010, 07:35 AM
Hmm. You seem to have:


#restofcontent { /*wrap rest of content of the page inside this div*/
clear: left;
}


which would apply to a div with id="restofcontent" - but you haven't got one of those. Try changing this:


/* Main */

#main {
width: 1100px;
margin: 0 auto;
background-color:#fff1d7;
background-image:url(img/pagebg.png);

}


to this:


/* Main */

#main {
width: 1100px;
margin: 0 auto;
background-color:#fff1d7;
background-image:url(img/pagebg.png);
clear:left;

}

question
Aug 8th, 2010, 04:15 AM
still no luck. :/ Thanks for all your help so far!

SB65
Aug 8th, 2010, 07:46 PM
Looks OK for me now in Chrome and Safari.