Centered layout shifts

[larzeb2000]

I have constructed a css stylesheet which has a centered layout. The
wrapper div is defined as 1000px. It contains a header div for the
entire wrapper width, and a left sidebar div and a content div on the
right. Everything appears as I would expect.

I have made a homepage with nothing in the content area, and another
page with the content filled so that the vertical scroll bar is
present.

When I'm in IE6 and go between the two pages, there is no apparent
shift of the wrapper and its contents. However, in Firefox and Opera,
the page with content shifts the entire wrapper over to the left of the
position it occupies when on the home page. It shifts by the width of
the vertical scroll bar. This doesn't look as "stable" as it does in
IE.

Is there any way to prevent this "shift" from occurring in FF and
Opera?
TIA Larzeb

CSS Stylesheet fragment:
#wrapper {
width: 1000px;
margin: 0 auto;
text-align: left;
position: relative;
}

#header {
width: 100%;
margin: 20px 0;
}
#sidebar {
width: 30%;
float: left;
}
#content {
width: 70%;
float: left;
}

[Beauregard T. Shagnasty]

la********@yaho o.com wrote:

I have constructed a css stylesheet which has a centered layout. The
wrapper div is defined as 1000px. It contains a header div for the
entire wrapper width, and a left sidebar div and a content div on the
right. Everything appears as I would expect.
1000px? That won't fit in my browser window. Please see:
http://allmyfaqs.net/faq.pl?AnySizeDesign
I have made a homepage with nothing in the content area, and another
page with the content filled so that the vertical scroll bar is
present.

When I'm in IE6 and go between the two pages, there is no apparent
shift of the wrapper and its contents. However, in Firefox and Opera,
the page with content shifts the entire wrapper over to the left of
the position it occupies when on the home page. It shifts by the
width of the vertical scroll bar. This doesn't look as "stable" as it
does in IE.

Without the URL to your page, anything is a guess. Best guess, from your
CSS, is that the 70% plus the 30% plus margins and padding, and any
borders, adds up to more than 100%, and the real browsers adjust for
that. IE not included.

--
-bts
-Warning: I brake for lawn deer

[Jim Moe]

la********@yaho o.com wrote:

When I'm in IE6 and go between the two pages, there is no apparent
shift of the wrapper and its contents. However, in Firefox and Opera,
the page with content shifts the entire wrapper over to the left of the
position it occupies when on the home page. It shifts by the width of
the vertical scroll bar. This doesn't look as "stable" as it does in
IE.

Is there any way to prevent this "shift" from occurring in FF and
Opera?

No.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

[Neredbojias]

To further the education of mankind, la********@yaho o.com vouchsafed:

I have constructed a css stylesheet which has a centered layout. The
wrapper div is defined as 1000px. It contains a header div for the
entire wrapper width, and a left sidebar div and a content div on the
right. Everything appears as I would expect.

I have made a homepage with nothing in the content area, and another
page with the content filled so that the vertical scroll bar is
present.

When I'm in IE6 and go between the two pages, there is no apparent
shift of the wrapper and its contents. However, in Firefox and Opera,
the page with content shifts the entire wrapper over to the left of the
position it occupies when on the home page. It shifts by the width of
the vertical scroll bar. This doesn't look as "stable" as it does in
IE.
There's irony for ya...
Is there any way to prevent this "shift" from occurring in FF and
Opera?

It sounds like the browsers are just readjusting center for the scrollbar.
That's a gooooooood thing. If you want to eliminate this, you can do
something like setting the body-height to 110% (-with other relevant
styling) but, of course, you'll always have a scollbar.

--
Neredbojias
Infinity has its limits.