Horizonal Scroll Bar in IE 6 and 7

[mblyman]

Hello,

New to the forums and I have a weird layout, css question.

I launched a new design last week, www.reminderband.com.

Layout is css. I have this weird problem in IE 6 and IE 7 where it creates a horizontal scroll bar at a resolution of 1024 x 768 or less. The design was originally a fluid design scaling from 800 x 600 up to 1200 wide. However, our graphics and programming personnel voted for a static width and 1024 is it.

I've tested in every browser and I get the horizontal scroll only in IE 6 and 7. I've tried everything that I've found in other forums and blogs to no avail. to rid myself of this funky horizontal scroll. Current width is set to 990px wide and works fine in other browsers. For some reason IE is picking up that there is content over there and pushes the width which causes a horizontal scroll. If I set teh width to 900 px it will work fine at 1024 but I'd rather be a little close to 1024 and maximize the space since we've decided to go over 800 anyways.

Any thoughts?

Css - http://reminderband.com/includes/main.css

Thanks in advance

Mike

[spikeZ]

Hi Mike and welcome to the forums

I am going to ask for this to be moved over to the CSS forum where you will get a prompter response

Spike

[mblyman]

OK that would be great.

However, I'm not entirely sure that it is a CSS issue. I'm looking for answers and if that is the best place to be then lets do it

[Dr John]

I also get the horizontal scroll bar in Firefox...
Although I get the scrollbar at a wider viewport in IE7 than FF - 1097 px for IE7, as opposed to 1006 px in FF

In IE the edges of the content are 57 px from the edge of the browser. Look for something that is 57 px wide perhaps.

[mblyman]

Dr. John,

I am not able to replicate the horizontal scroll on FF. I'm on a PC with windows XP and FF 2.0

My screen resolution is set to 1024 x 768 and I still have a good 5 - 10 pixels before I start getting a scroll bar.

I've seen different widths for a 1024 layout. Anybody have a recommended set width that they like to use that accommodates all browsers. I choose 990 simply because in testing it appeared to work in all browsers on a Mac and PC except for IE 6 & 7 with the weird horizontal scroll issue.

[Kravvitz]

I suggest you start by fixing your XHTML errors.

I don't like going wider than 780px for a fixed width layout.

[mblyman]

Unfortunately the majority of those XHTML errors are from tracking scripts and live chat includes that are code that we receive from third party and thus can not change because it is required for the service we use. The main culprit is liveperson.com. Almost all the errors refer to their code that is included in the header and footer of every page. I know that all 23 errors are not causing the problem I'm having with the horizontal scroll. I'd love our pages to validate but with the thrid party software includes it's near impossible

[Paul O'B]

Hi,

Its the copyright messsage that is causing the scroll because its in the wrong place.

It should be inside your wrapper here.

        <div id="copyright"> <a href="http://www.bbbonline.org/cks.asp?id=1050728112937" target="_blank" rel="nofollow" ><img src="http://www.reminderband.com/images/ReliabilitySeal4.gif" alt="bbb reliability seal" border="0" /></a></div>
</div>
        <!--END OF WRAPPER-->
    </div>
    <!--END OF EXPANDER-->
</div>
<!--END OF SIZER-->
</body>
</html>