div width 100%?

[Rich West]

Can anyone tell my what I'm doing wrong here: http://www.tsmithstudio.com .
I've set the width of the div at the top of the page to 100% and with IE6,
there's a gap at the right edge of the page. (NS7 works as I'd expact with
no gap.) I've tried setting it larger, but I'm trying to avoid the
horizontal scroll bar.

Thanks in advance for your help.

Rich West

 

[Richard]

Can anyone tell my what I'm doing wrong here: http://www.tsmithstudio.com
. I've set the width of the div at the top of the page to 100% and with
IE6, there's a gap at the right edge of the page. (NS7 works as I'd
expact with no gap.) I've tried setting it larger, but I'm trying to
avoid the horizontal scroll bar.

Thanks in advance for your help.

Rich West

Set to 99% or 98%. IE brings out the scroll bar due to the hidden border of
divisions.
Try it with a table with no borders and you'll have the same result.

 

[Rich West]

Thanks, but no dice. Still have the gap at 99%, 98%... I can set it to
102.2% and close the gap, but NS7 puts a horizontal scroll bar (as it
should, I guess).

 

[Steve Pugh]

Can anyone tell my what I'm doing wrong here: http://www.tsmithstudio.com .
I've set the width of the div at the top of the page to 100% and with IE6,
there's a gap at the right edge of the page. (NS7 works as I'd expact with
no gap.) I've tried setting it larger, but I'm trying to avoid the
horizontal scroll bar.

You've absolutely positioned the top div, with a width of 100%. The
width is being calculated before the positioning and so the width is
the width of the browser window minus the default margin.

Adding margin: 0; to the styles for body will correct the display in
IE 5 - 6.

I would not have used absolute positioing for that layout. It creates
brittle layouts that fall apart in browser window sizes, and with text
sizes, that depart from the mean. Even a modest text zoom of 120% in
Mozilla begins to show problems.

Steve

 

[Steve Pugh]

Set to 99% or 98%. IE brings out the scroll bar due to the hidden border of
divisions.

Didn't you read what he wrote? 100% is leaving a gap. Why do you think
that making it smaller than 100% will remove that gap (i.e. make teh
div wider than it was at 100%)?

Steve

 

[Rich West]

Thank you. That did it: including margin: 0px in the body selector. And
thank you for your advice regarding the absolute positioning. It's hard for
me to give up control - guess I need a shrink and not an html news group for
that ;-) I'll try to rework the site without the absolute positioning..

Rich

 

[Daniel Ruscoe]

Can anyone tell my what I'm doing wrong here: http://www.tsmithstudio.com.

You're using an external stylesheet as the same time as style attributes
in your divs.

Where you have:

<div id="terry" style="position:absolute; left:14px; etc, etc

You really want:

* terry.css *

div#terry {
position:absolute;
left:14px;
etc, etc
}

* index.html *

I've set the width of the div at the top of the page to 100% and with IE6,
there's a gap at the right edge of the page.

Looks fine in both IE6 and Opera 7.23.

I've tried setting it larger

Don't set a div width larger than 100%.

I'm not seeing a gap, but try adding "padding:0" to 'body' in terry.css.