Left side of page disappears in Mozilla?

Hi,

I'm playing around with a layout for a weblog. A mockup can be seen
at <http://outside.bakkelygaard.dk/~wegge/testblog/index.html>.

The page has a fixed width of 800px, so I'm perfectly aware that
horizontal scroll will occur wneh the brpwser viewport is narrower
than that. That's simply a design tradeoff between having a useable
proportion between the [Stuff]-bar on the right and the main content.

However, I've noted a peculiar effect when looking at the page with
Mozilla 1.4: When the viewport is too narrow, the left part of the
page is inaccisible. In MSIE 6, hopwever, the page looks allright.

If anybody can figure out what I'm doing wrong or overlooking, I'd
appreciate a hint in the rigth direction.

--
/Wegge <http://outside.bakkelygaard.dk/~wegge/>

"Anders" == Anders Wegge Jakobsen <wegge (AT) bakkelygaard (DOT) dk> writes:

Hi,
I'm playing around with a layout for a weblog. A mockup can be seen
at <http://outside.bakkelygaard.dk/~wegge/testblog/index.html>.

Oops, sometimes you get a funny result from translating too direct
from one language to another.

In the paragraph above, please substitute "playing around" with
"experimenting". Sorry for the bad choice of words :-/

--
/Wegge <http://outside.bakkelygaard.dk/~wegge/>

"Brian" == Brian <usenet1 (AT) mangymutt (DOT) com.invalid-remove-this-part> writes:

Anders Wegge Jakobsen wrote:
I'm playing around with a layout for a weblog. A mockup can be seen
at <http://outside.bakkelygaard.dk/~wegge/testblog/index.html>.
The page has a fixed width of 800px,

Entirely unnecessary.

I suppose so, yes.

so I'm perfectly aware that horizontal scroll will occur wneh the
brpwser viewport is narrower than that. That's simply a design
tradeoff between having a useable proportion between the
[Stuff]-bar on the right and the main content.

Read: "and I'm unwilling to accomodate others." So, on behalf of
those with a window narrower than 800px, may I just say thanks for
being so considerate.

Read: "Tradeoff means I've been unable to come up with a better
alternative, that gives a remotely acceptable behavoiur in CSSignorant
browsers"

However, I've noted a peculiar effect when looking at the page with
Mozilla 1.4: When the viewport is too narrow,

? But you designed it this way.

No, I designed the page on the premise that, yes, horizontal scroll
would occur in ceratin circumstances, but not that the content should
be inaccesible.

the left part of the page is inaccisible.

I cannot replicate that problem in Mozilla 1.3/Win2k. In Moz 1.3,
when my window is less than 800px wide, the *right* side is inaccessible.

Hmm, looks like a Mozilla bug then.

If anybody can figure out what I'm doing wrong

You fixed your design at 800px.

I'd appreciate a hint in the rigth direction.

Stop breaking the web's inherent flexibility; then all your content
will be accessible.

If you have a better solution at hand, I'm all ears.

--
/Wegge <http://outside.bakkelygaard.dk/~wegge/>

Anders Wegge Jakobsen wrote:

"Brian" == Brian <usenet1 (AT) mangymutt (DOT) com.invalid-remove-this-part> writes:

Anders Wegge Jakobsen wrote:
at <http://outside.bakkelygaard.dk/~wegge/testblog/index.html>.
The page has a fixed width of 800px,

Entirely unnecessary.

Read: "Tradeoff means I've been unable to come up with a better
alternative, that gives a remotely acceptable behavoiur in CSSignorant
browsers"

So, does this mean that you get "unacceptable" behavior when CSS isn't
applied at all? That indicates a structural problem and should be fixed
regardless of any CSS issues. If you are actually trying to get the
page to look the same in all browsers regardless of their CSS
capabilities, then you are in for much headaches and frustration. I
suggest giving it up now before you dig in any deeper.

If you have a better solution at hand, I'm all ears.

There are lots of columned layout templates out there, links have been
posted here many times. It would take about 3 seconds to find them on
google, but here's one such posting:
<URL:http://groups.google.com/groups?hl=en&lr=&ie=UTF-8&oe=UTF-8&selm=ar3m91%24kaa%241%248300dec7%40news.demon.co .uk>

--
To email a reply, remove (dash)ns(dash). Mail sent to the ns
address is automatically deleted and will not be read.

"kchayka" == kchayka <kcha-ns-yka (AT) sihope (DOT) com> writes:

Anders Wegge Jakobsen wrote:
"Brian" == Brian <usenet1 (AT) mangymutt (DOT) com.invalid-remove-this-part> writes:

Anders Wegge Jakobsen wrote:
at <http://outside.bakkelygaard.dk/~wegge/testblog/index.html>.
The page has a fixed width of 800px,

Entirely unnecessary.

Read: "Tradeoff means I've been unable to come up with a better
alternative, that gives a remotely acceptable behavoiur in CSSignorant
browsers"

So, does this mean that you get "unacceptable" behavior when CSS isn't
applied at all? That indicates a structural problem and should be fixed
regardless of any CSS issues. If you are actually trying to get the

Well, without CSS, the different parts of the page is presented in
the order I find most important, and the various browsers (Lynx, IE6,
Mozilla, w3m) all present the content to the best of their abilities.

page to look the same in all browsers regardless of their CSS
capabilities, then you are in for much headaches and frustration. I
suggest giving it up now before you dig in any deeper.

No, I'm not aiming for pixel precise placement. I'd be happy, if I
could have a 2 column layout, with a 4:1 width ratio, with a
guaranteed minimal width for both columns. If the right-hand column
doesn't fit in the viewport, given the minimum size constraints, it
should reflow to the bottom of the main content.

What I have been able to find has one of two flaws:

a) It relies on the minimum-width property, which isn't in fact
supported that widely.

or

b) It depends on arcane knowledge of which browser has what bugs in
regard to CSS.

So, I ended up with the abovementioned tradeoff.

If you have a better solution at hand, I'm all ears.

There are lots of columned layout templates out there, links have been
posted here many times. It would take about 3 seconds to find them on
google, but here's one such posting:
URL:http://groups.google.com/groups?hl=e....demon.co .uk

Thanks, I'll take a look at it.

To email a reply, remove (dash)ns(dash). Mail sent to the ns
address is automatically deleted and will not be read.

Why not use an effective spamfilter insted?

--
/Wegge <http://outside.bakkelygaard.dk/~wegge/>

"Brian" == Brian <usenet1 (AT) mangymutt (DOT) com.invalid-remove-this-part> writes:

Anders Wegge Jakobsen wrote:
in fact I was trying to figure out *how* to avoid absolute widths
whereever possible,

That sounds like a good plan. But your first message gave no
indication that you wanted to lose the fixed layout. It looked to
me like you were trying to, uh, fix the fixed layout, if you see
what I mean.

Not quite, bit I'll take your word for it. I'm not english speaking
by birth, so it's probably my mistake.

I would get rid of the horizontal scroll, but that won't help me if
i display an image that's wider than the viewport.

With replaced content, you have no choice, other than to modify the
content itself. But your mock-up has only text, no images. Thus,
this exception does not apply.

There is one image, in the top of the page, which right now is just
a dashed rectangle. I'll probably end up with an image that says
"Affix logo here", but still...

I have one problem left, though. The sideboxes still have an
absolute width, which I'd like to get rid of somehow:
Unless div.sidebox has an absolute width, IE6 renders the first box

the first "sidebox?"

Yes, in the current version there are three <div class="sidebox">,
and it's only the first that utilizes the available space in IE,
unless a specific width is set.

to fill the avaiable horizontal space, but the following divs a
rendered as narrow as possible. Is there a workaround for this?

Not sure I follow. Assign a width to sidebody, in flexible units (em
units seem appropriate here). That seems too simple, there must be
something I'm missing. I don't have IE6. It looks fine in IE
5.0/Win2k, fwiw. All widths are uniform.

Well, that sort of makes a mockery out of the whole flexibility
thing, doesn't it? After all, em is still an absolute measure of
sorts, so in the extreme cases on a narrow viewport with a large (and
thus wide font), the sidebox could end up overlapping the rest of the
content. Especially on mobile devices.

--
/Wegge <http://outside.bakkelygaard.dk/~wegge/>