Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

General Discussion

Posted by Alan Steffens
Alan Steffens
2,558 Points

Internet Explorer debug question to find why a horizontal scroll bar is being added to a page

I just released the new version of the website I've been working on and found an issue on one page where IE is sticking a horizontal scroll bar toward the bottom of the page. It appears to be for about 5 extra pixels that I can't account for. All other browsers display the page properly without a scroll bar.

When using IE Inspect on that section of the page, it is not showing me anything that is helping me figure out where that is coming from. I have one clue in that the scroll bar appears above my footer, which puts it somewhere in the contenttextarea section of my code.

Anyone know how to best debug this kind of issue? The page in question is at http://www.atscorp.net/contactus.html. To see the issue make sure to open it up in Internet Explorer. I'm seeing the scroll bar in the latest version of IE 11.

Thanks in advance for your help.

2 Answers

Kara Proulx
Kara Proulx
3,392 Points
Kara Proulx
Kara Proulx
3,392 Points

Hey Alan,

We're sorry to hear of any troubles. We do typically recommend using Chrome or Firefox for the best user experience with our site. Would you be able to try either of those browsers to see if the same thing happens?

Best, Kara

Alan Steffens
Alan Steffens
2,558 Points

In my problem description, I stated that the page renders properly in all other browsers. I'm trying to figure out why it doesn't in Internet Explorer.

Alan Steffens
Alan Steffens
2,558 Points
Alan Steffens
Alan Steffens
2,558 Points

I figured it out with the help of my cousin web developer. I had used percentages for the width of my left and right box section floats on that page. Normally that would be fine, but the percentages I used were 35.5% (right) and 33.5% (left). IE handles float fractionals by rounding up instead of dealing with them. It was adding 1% to my page width and forcing in the horizontal scroll bar. I changed the percentages to 36% and 34% to fix the IE page rendering issue. That didn't affect the look of my page noticeably. Hope this helps others on TeamTreehouse who may encounter a similar issue. As a matter of course I always test my website pages in Chrome, Firefox, Safari and IE ... the main four browsers.