Santhosh

Last night, I was working on a template for a new bulletin board software. Well the bulletin board is being developed by my friend. And am taking designing part of it. Let the software and person be forbidden. While designing the homepage, we noticed horizontal scrollbar in IE 6 & 7 @ low resolutions. So he informed me regarding that.

And I thought of using javascript in the beginning, but he argued not to do that, because the reason is simple. Not everyone’s browser will have javascript installed/enabled. So I remembered a small CSS code, which can do the job. Then, we solved the problem.

So, I thought of writing a small tutorial which teaches about disable or removing unwanted horizontal scrollbar in IE6 / IE7 without using any javascripts.

If a theme or a template spans more than 1000px in width, the users who are on 1024 x 768 resolution monitors will see frustrating and unwanted scrollbars in IE 6 & 7.

In order to disable it, there are several methods. Among those javascript is the main, but what if the user do not have javascript installed on his/her browser?

So the best way to get rid of the scrollbar is to add a CSS code, that will disable the scrollbar bars with no issues.

Below is the CSS code, that you will need to add in the stylesheet of your theme or template:

.html, body {
overflow-x: hidden;
}

If you want to embed in the index page, add this beforre </head> :

<style type="text/css">
<!--
.html, body {
overflow-x: hidden;
}
-->
</style>

Thats all!