Horizontal Scrolling issue with IE-8

[aryagaurav001]

Hi! For the past so many hours I have been scratching my head to disable the horizontal scrollbar which ie-8 shows by default. Finally, after so many trial and attempts I somehow, was able to fix it.

I am trying to do something like this:
I have a container div 100% X 100%
inside this, I have 6 divs 3 on the upper half and 3 on the lower half of screen.
Attributes of containerdiv are as follows:

	 	border:1px solid grey;                     //border is here for testing purpose only.

width: 100%;

height: 100%;

margin: 0;

padding: 0;

left: 0;

top: 0;

position: fixed;

Attributes of upperleftdiv are as follows:

	 	border:1px solid grey;

width:50%;

height:50%;

-moz-border-radius: 5px;

border-radius: 5px;

position: absolute;

Attributes of uppermiddlediv are as follows:

	 	border:1px solid grey;

left:50%;

width:25%;

height:50%;

-moz-border-radius: 5px;

border-radius: 5px;

position: absolute;

Attributes of upperrightdiv are as follows:

	 	border:1px solid grey;

left:50%;

width:25%;

height:50%;

-moz-border-radius: 5px;

border-radius: 5px;

position: absolute;

In my view, setting the containerdiv attribute position ‘fixed’ solves the problem.
what I am not able to understand is how it solves..can anyone tell me.

thanks

[neerukool]

I guess that’s too much of code.
You could’ve just put scroll=”no” attribute in body tag.

[Senff]

Hard to tell without seeing an actual live site.

But if a container has a 100% width (or if a number of containers have a combined width of 100%), then it will take up the full width of the page. However, when you add borders (like you’ve done in your code above), it will take up MORE horizontal space, and that may be the cause of the scrollbar.

[resweb]

because when you write position:fixed it does not apply left attribute

[Author]

Posts