horizontal scrollbar appearance

Hi,

At http://archytas.nl/ there appears to be a horizontal scrollbar when
using Mozilla Firebird (not in IE). The website (container DIV) should
be 770 px wide, so there shouldn't be any reason for the scrollbar to
appear at 1024x768.
I think it has something to do with the DIV properties defined in the
inline stylesheet. I hope someone can tell me why the horizontal
scrollbar will appear.

Much thanks in advance,

Roderik Emmerink

In article Roderik wrote:

Hi,

At http://archytas.nl/ there appears to be a horizontal scrollbar when
using Mozilla Firebird (not in IE). The website (container DIV) should
be 770 px wide, so there shouldn't be any reason for the scrollbar to
appear at 1024x768.
I think it has something to do with the DIV properties defined in the
inline stylesheet. I hope someone can tell me why the horizontal
scrollbar will appear.

Much thanks in advance,

You have broken your layout purposefully, and then wonder why it breaks?
It worked fine here with 580px wide window, when I used my userstyle. All
it needed to do was to override that 770px.

I suppose your problem is that you use relative positioning cluelessly.
Have you never heard margins and paddings?

For example
<h1 style="position: relative; margin: 0px; top: 40%;left: 150px;">
Here you position 770px wide element 150px more right. If you replace
left:150px with something suitable, like padding-left:15em¹ for #divTop,
it works better (fits 800*600 on fullscreen even whiout userstyle).

Your layout doesn't need to be fixed, in fact it works nicely whiout
restrains. Use max-width to limit width, if you think that would come
issue. But remember that there really is not that many people running
browser in bigger that 10

[1] you really should use em or ex unit to measure elements whose
contents is text, that aplies everywhere in your site.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

On Mon, 3 Nov 2003 03:08:59 +0200, Lauri Raittila
<lauri (AT) raittila (DOT) cjb.net> wrote:

In article Roderik wrote:
Hi,

At http://archytas.nl/ there appears to be a horizontal scrollbar when
using Mozilla Firebird (not in IE). The website (container DIV) should
be 770 px wide, so there shouldn't be any reason for the scrollbar to
appear at 1024x768.
I think it has something to do with the DIV properties defined in the
inline stylesheet. I hope someone can tell me why the horizontal
scrollbar will appear.

Much thanks in advance,

You have broken your layout purposefully, and then wonder why it breaks?
It worked fine here with 580px wide window, when I used my userstyle. All
it needed to do was to override that 770px.

I suppose your problem is that you use relative positioning cluelessly.
Have you never heard margins and paddings?

For example
h1 style="position: relative; margin: 0px; top: 40%;left: 150px;"
Here you position 770px wide element 150px more right. If you replace
left:150px with something suitable, like padding-left:15em¹ for #divTop,
it works better (fits 800*600 on fullscreen even whiout userstyle).

Your layout doesn't need to be fixed, in fact it works nicely whiout
restrains. Use max-width to limit width, if you think that would come
issue. But remember that there really is not that many people running
browser in bigger that 10

[1] you really should use em or ex unit to measure elements whose
contents is text, that aplies everywhere in your site.

Thanks a lot for your answer. I didn't expect the width to inherit.

regards,

Roderik

In article Roderik wrote:

Thanks a lot for your answer. I didn't expect the width to inherit.

It isn't inherited. The whole element is rendered as it would be whiout
positioning, exept in different place. That is the idea of relative
positioning. Block elements fill container by default. If such block
element is then positioned relatively, it will still be same size.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

On Mon, 3 Nov 2003 21:03:25 +0200, Lauri Raittila
<lauri (AT) raittila (DOT) cjb.net> wrote:

In article Roderik wrote:
Thanks a lot for your answer. I didn't expect the width to inherit.

It isn't inherited. The whole element is rendered as it would be whiout
positioning, exept in different place. That is the idea of relative
positioning. Block elements fill container by default. If such block
element is then positioned relatively, it will still be same size.

I understand. The block element uses the width of its container was
what I meant by inherited. I did expect that it would take the amount
of width necessary to contain the text, but it wasn't the case.