Emulating a table layout purely using CSS

[Anthony Williams]

Good morning,

I'm currently designing a site, using CSS, and wish to create a variable
width two-column layout, with header and footer, and one fixed-width column
on the left.

Previously, I would have used a table to do this, using the following code:
<table width="100%">
<tr>
<td colspan="2">Header</td>
</tr>
<tr>
<td width="160">Navigation</td>
<td>Body</td>
</tr>
<tr>
<td colspan="2">Footer</td>
</tr>
</table>
Now I'm using CSS, I don't want to have to do this, so have come up with a
design. I'm a little peeved that I can't put the navigation AFTER the
content (though I'm told this is a common occurance, and I should use a
"Skip Nav" button) but not everything is working - I've had to use scripting
to make the Navigation DIV the same height as the Content DIV (is there a
way to make this work using CSS?)

I was considering using scripting to set the width, but want to see if this
can be made to work purely using CSS (after all, what's the point of the
stylesheet if I have to complement it with scripting?)

Any help would be greatly appreciated, and you can check out the work at:

http://dev.listersgroup.com/listers.group/listers.aspx

Many thanks,
Anthony Williams

[Neal]

On Tue, 3 Feb 2004 12:12:37 +0000 (UTC), Anthony Williams
<to**@bigtone.withoutthis.net> wrote:

I'm a little peeved that I can't put the navigation AFTER the
content
Sure you can. Peek at http://users.rcn.com/neal413 where I've done
something similar.

You can choose to float the content right and the nav will end up left. Of
course, you want the nav width to be set, right? If you're able, let that
be adjustible, say as a % of the width, or use a pixel-width layout like I
did, then you can control it.
(though I'm told this is a common occurance, and I should use a
"Skip Nav" button) but not everything is working - I've had to use
scripting
to make the Navigation DIV the same height as the Content DIV (is there a
way to make this work using CSS?)

Why does everyone want a friggin' racing stripe? I mean, functionally,
does it matter that Box 1 and Box 2 are the same height? In CSS, it's not
always possible to exert control over the height of a box, the content
determines that.

Remember, table layout is a grid model, and CSS is a box model. (For those
about to argue, yeah, yeah...) It's a mistake to try to "emulate" a table
layout with CSS. It's like translating a poem to another language, you
have to recast every thought, you have to make it different but equal.
That's why translators of poetry are so rare, and why web design so often
sucks.

I know there's a way to do this, I haven't had half a cup of coffee yet so
I'll leave it for later. But I'm sure there's a solid solution.

[Peter Foti]

"Anthony Williams" <to**@bigtone.withoutthis.net> wrote in message
news:bv**********@titan.btinternet.com...

Now I'm using CSS, I don't want to have to do this, so have come up with a
design. I'm a little peeved that I can't put the navigation AFTER the
content (though I'm told this is a common occurance, and I should use a
"Skip Nav" button) but not everything is working - I've had to use scripting to make the Navigation DIV the same height as the Content DIV (is there a
way to make this work using CSS?)

You certainly CAN put the navigation after the content. And I'll keep my
comments regarding the "Skip Nav" gibberish to myself. I don't have a
working example available to post, but check out:
www.csszengarden.com
Some of the designs do just what you are looking for.

Hope this helps.
Regards,
Peter Foti

[Beauregard T. Shagnasty]

Quoth the raven named Anthony Williams:

I'm currently designing a site, using CSS, and wish to create a
variable width two-column layout, with header and footer, and one
fixed-width column on the left.
To borrow a brucieism: easy peasy.
Previously, I would have used a table to do this, using the
following code:
<schnip table code>
Now I'm using CSS, I don't want to have to do this, so have come up
with a design. I'm a little peeved that I can't put the navigation
AFTER the content (though I'm told this is a common occurance, and
I should use a "Skip Nav" button) but not everything is working -
I've had to use scripting to make the Navigation DIV the same
height as the Content DIV (is there a way to make this work using
CSS?)
Please don't get peeved. <g> It is simply a matter of positioning. See
this little template I made for a friend awhile ago. Notice in the
source that the menu is after the content in the logical order of the
HTML. There is also a hidden - display: none - link above the content
to go to the menu when using a non-CSS browser.

http://home.rochester.rr.com/bshagnasty/twocolumn.html
I was considering using scripting to set the width, but want to see
if this can be made to work purely using CSS (after all, what's the
point of the stylesheet if I have to complement it with scripting?)

No scripting required.

--
-bts
-This space intentionally left blank.

[Anthony Williams]

"Neal" <ne*****@spamrcn.com> wrote in message
news:op**************@news.rcn.com...

On Tue, 3 Feb 2004 12:12:37 +0000 (UTC), Anthony Williams
<to**@bigtone.withoutthis.net> wrote:

I'm a little peeved that I can't put the navigation AFTER the
content
Sure you can. Peek at http://users.rcn.com/neal413 where I've done
something similar.

You can choose to float the content right and the nav will end up left. Of
course, you want the nav width to be set, right? If you're able, let that
be adjustible, say as a % of the width, or use a pixel-width layout like I
did, then you can control it.

From the design point of view, it would be nice if the layout was fixed
width - that plus we've sold the design to the people who are buying this,
so it would be nice to give them what they've asked for. I'm all for
accessible content and standards-based design, and whilst I've used CSS
thousands of times before, this is my first attempt at making a totally
standards-based website.

(though I'm told this is a common occurance, and I should use a
"Skip Nav" button) but not everything is working - I've had to use
scripting
to make the Navigation DIV the same height as the Content DIV (is there a
way to make this work using CSS?)

Why does everyone want a friggin' racing stripe? I mean, functionally,
does it matter that Box 1 and Box 2 are the same height? In CSS, it's not
always possible to exert control over the height of a box, the content
determines that.

It's no major issue, and to be completly honest, we're likely to remove the
faded strip down the left hand side in favour of something else which
doesn't have the 'racing stripe'. The real issue is making sure that the
content stays on the right, and that - in Mozilla/Firebird - the content
doesn't run out into the left, underneath the Navigation div.
Remember, table layout is a grid model, and CSS is a box model. (For those
about to argue, yeah, yeah...) It's a mistake to try to "emulate" a table
layout with CSS. It's like translating a poem to another language, you
have to recast every thought, you have to make it different but equal.
That's why translators of poetry are so rare, and why web design so often
sucks.
I don't know about a mistake - there must be a way to achieve the same goals
(from a design perspective) using CSS as opposed to table-layout. In the
event that marketing decide to keep the 'racing stripe', I'll probably use
the ALA method of 'extending' the columns, at the expense of losing the
gradient on the background.
I know there's a way to do this, I haven't had half a cup of coffee yet so
I'll leave it for later. But I'm sure there's a solid solution.

Enjoy the first cup, and hopefully I'll try and find some more resources.
Mezzoblue had something about a fixed size column on the right, with a
negative right margin - which works as long as the nav is on the right but,
for some reason, doesn't if it's on the left.

I'll keep looking for now.

[Anthony Williams]

"Beauregard T. Shagnasty" <a.*********@example.invalid> wrote in message
news:j7*******************@twister.nyroc.rr.com...

Please don't get peeved. <g>
Ah, but being peeved is so much nicer than being anything else remotely
linked to not being happy about something. However, I digress.
It is simply a matter of positioning. See
this little template I made for a friend awhile ago. Notice in the source
that the menu is after the content in the logical order of the HTML. There
is also a hidden - display: none - link above the content to go to the
menu when using a non-CSS browser.

http://home.rochester.rr.com/bshagnasty/twocolumn.html

Many thanks for the link, however, your (lovely) two column layout has one
minor problem - both columns are given a percentage width. I require a two
column layout which has one fixed width column, and one column which fills
the remaining size.

Thanks though! :o)

[Michael Rozdoba]

Anthony Williams wrote:

[snip]

Any help would be greatly appreciated, and you can check out the work at:

http://dev.listersgroup.com/listers.group/listers.aspx

I think if you change:

#Page {
background-color: #D2CFDF;
background-image: url(../../img/bg.gif);
background-repeat: repeat-x;
background-position: 0px 0px;
}

#Navigation {
clear: left;
float: left;
width: 162px;
background-image: url(../../img/bg-b50.gif);
background-repeat: repeat-x;
background-position: 0 -42px;
background-color: #776E9F;
padding-top: 4px;
}

#Content {
display: block;
padding: 8px;
float: right;
}
#Content p {
display: block;
width: 100%;
margin: 6px 0;
line-height: 1.5;
}

to:

#Page {
background-image: url(../../img/bg-b50.gif);
background-repeat: repeat-x;
background-position: 0px 0px;
background-color: #776E9F;
}

#Navigation {
clear: left;
float: left;
width: 162px;
padding-top: 4px;
}

#Content {
margin-left: 162px;
padding: 8px;
background-color: #D2CFDF;
background-image: url(../../img/bg.gif);
background-repeat: repeat-x;
background-position: 0px 0px;
}

#Content p {
margin: 6px 0;
line-height: 1.5;
}

It will do what you want without extra script.

I'm no expert, but the way it was written, as Content had width of Page
& was floated, it couldn't fit next to Navigation & so dropped below.

After the changes above, Content is still 100% wide, but ignores the
float; & the margin-left takes care of making sure they don't overlap,
visual content wise.

There are a number of other 'suggestions' some posters might make - such
as not specifying widths in px for nav as it will mess up if the user
has larger fonts; use ems say. Don't set the body font to under 100% of
the user's default size. You'll notice if you stick around here :)

--
Michael
m r o z a t u k g a t e w a y d o t n e t

[Beauregard T. Shagnasty]

Quoth the raven named Anthony Williams:

"Beauregard T. Shagnasty" <a.*********@example.invalid> wrote in
message news:j7*******************@twister.nyroc.rr.com...

http://home.rochester.rr.com/bshagnasty/twocolumn.html
Many thanks for the link, however, your (lovely) two column layout
has one minor problem - both columns are given a percentage width.
I require a two column layout which has one fixed width column, and
one column which fills the remaining size.

Hey, feel free to fiddle with the css. You could probably add a width:
to the nav div, and alter the margins a bit to achieve your goal.

'Twas a sample. <g>

Oh, regards your one fixed column: what do you want to happen when a
visitor resizes the text? Do you not want the column to grow in size
along with the text? Be careful that the text does not float "outside
the box."
Thanks though! :o)

My pleasure.

--
-bts
-This space intentionally left blank.

[Neal]

On Tue, 3 Feb 2004 17:54:09 +0000 (UTC), Anthony Williams
<to**@bigtone.withoutthis.net> wrote:

From the design point of view, it would be nice if the layout was fixed
width - that plus we've sold the design to the people who are buying
this,
so it would be nice to give them what they've asked for. I'm all for
accessible content and standards-based design, and whilst I've used CSS
thousands of times before, this is my first attempt at making a totally
standards-based website.

Ya, here's the problem we face. If your irst float doesn't have an
explicit or implicit width, it will take up all the width. Therefore, if
you want the content first in the code, you have to assign it a width.
Since you want it to flex, a percentage seems like the best bet, but
unfortunately this will make the other float have to be a percentage as
well, which you do not want.

Easiest fix to get the precise design you want is to put the nav before
the content. I know that's not what you'd prefer, nor is it what I prefer.

If only we could do math in the values for distance! If we could simply
say:

#content {float: right; width: 100%-10em;}
#nav {float: left; width: 10em;}

we'd be in business, wouldn't we?

This style works in IE6, haven't tested in all browsers. The wrap div
surrounds the content and the nav divs, and for whatever reason if I don't
set a border it won't work...

#header {width: 100%; margin: 1em 0;}
#wrap {position: relative; margin: 0; border: 1px white solid;}
#content {border: 0; border-left: 12em gray solid; padding-left: 1em;
margin: 1em; width: auto;}
#nav {position: absolute; top: 1em; left: 0; margin: 1em; width: 10em;}

[Matthias Gutfeldt]

Anthony Williams wrote:

Good morning,

I think your subject line says it all. There's no point in "Emulating a
table layout purely using CSS". If you want a table layout, use a table,
it's a lot easier. You should only CSS for CSS layouts. Different concepts.
Matthias

[Anthony Williams]

"Neal" <ne*****@spamrcn.com> wrote in message
news:op**************@news.rcn.com...

On Tue, 3 Feb 2004 17:54:09 +0000 (UTC), Anthony Williams
<to**@bigtone.withoutthis.net> wrote:

Easiest fix to get the precise design you want is to put the nav before
the content. I know that's not what you'd prefer, nor is it what I prefer.
I'm resigned to this fact - so I've made a few changes to the page, in line
with your suggestions.
If only we could do math in the values for distance! If we could simply
say:

#content {float: right; width: 100%-10em;}
#nav {float: left; width: 10em;}

we'd be in business, wouldn't we?
Sounds an awful lot like CSS Expressions, which as far as I know aren't
supported in anything but IE, have nasty overheads, and can get you into all
sorts of trouble with infinite loops and the like. I've been thinking
something similar in CSS for a long long time.

The negative margin trick that I found on mezzoblue.com (see
http://www.mezzoblue.com/archives/20...hall/index.php) works
just fine, but this only works where the nav resides on the right for some
bizarre reasons. If you attempt to float the DIV right and pull the left
margin in, it refuses to work - on IE and Firebird.
This style works in IE6, haven't tested in all browsers. The wrap div
surrounds the content and the nav divs, and for whatever reason if I don't
set a border it won't work...

#header {width: 100%; margin: 1em 0;}
#wrap {position: relative; margin: 0; border: 1px white solid;}
#content {border: 0; border-left: 12em gray solid; padding-left: 1em;
margin: 1em; width: auto;}
#nav {position: absolute; top: 1em; left: 0; margin: 1em; width: 10em;}

I've put something new together at
http://dev.listersgroup.com/listers.group/listers.aspx which you can take a
look at. It works just great, except that Firebird refuses to float the
content DIV correctly.

Any further help would be great!

[Anthony Williams]

"Anthony Williams" <to**@bigtone.withoutthis.net> wrote in message
news:bv**********@sparta.btinternet.com...

I've put something new together at
http://dev.listersgroup.com/listers.group/listers.aspx which you can take
a look at. It works just great, except that Firebird refuses to float the
content DIV correctly.

Ignore my last remark, as I've just this minute made a few changes to the
structure and the CSS, and we seem to be in business. The design works, as
expected, in both Internet Explorer 6 and Firebird 0.7 - other browsers have
yet to be tested, but I'm encouraged enough with the success of these two to
continue with the project in CSS.

Thank you all for your help, and huge gratitude to Neal and the rest of you
guys!

[Roy Reed]

> Oh, regards your one fixed column: what do you want to happen when a

visitor resizes the text? Do you not want the column to grow in size
along with the text? Be careful that the text does not float "outside
the box."

Wouldn't a width specified in ems avoid this problem?

--
Must fly

Roy

www.reeddesign.co.uk

[Neal]

On Tue, 03 Feb 2004 22:32:41 GMT, Beauregard T. Shagnasty
<a.*********@example.invalid> wrote:

Quoth the raven named Anthony Williams:

Many thanks for the link, however, your (lovely) two column layout
has one minor problem - both columns are given a percentage width.
I require a two column layout which has one fixed width column, and
one column which fills the remaining size.

Oh, regards your one fixed column: what do you want to happen when a
visitor resizes the text? Do you not want the column to grow in size
along with the text? Be careful that the text does not float "outside
the box."

When I try to do something like this I set IE to largest fonts and make
sure it all looks good at that setting. Even a pixel width column can be
rigged to work properly if the author takes care.

[Andy Mabbett]

In message <op**************@news.rcn.com>, Neal <ne*****@spamrcn.com>
writes

Peek at http://users.rcn.com/neal413 where I've done something similar.
[...]or use a pixel-width layout like I did, then you can control it.

You have a horizontal scroll bar at anything under 800px. This is good
because..?
--
Andy Mabbett
"The Internet is a reflection of our society[ ...]. If we do not like what we
see in that mirror the problem is not to fix the mirror, we have to fix
society." Vint Cerf

[Neal]

On Sat, 7 Feb 2004 01:20:48 +0000, Andy Mabbett
<us**********@pigsonthewing.org.uk> wrote:

You have a horizontal scroll bar at anything under 800px. This is good
because..?

It's good because users viewing at a browser width of over 800px see the
page as designed, and users using a browser width between 500 and 800px
have to do a very small and unobtrusive amount of scrolling, and gain a
benefit from the content column not squishing too narrow as would happen
in a fluid design.

The content width is 500px, which means the only necessary horizontal
scrolling will be between the content and the navigation, which occurs at
the beginning and end of the visit. If the horizontal scrolling was
necessary while reading content, I'd agree it was bad.

As this is not a commercial site per se, and is not geared to the
"experienced" web user, accommodating the rare user who runs their browser
at under 500px is not of high priority. If we're talking about a site
which is supposed to keep the visitor and turn the visit into profit, I
agree, accommodate as many users as possible. But in this specific case, I
think an 800px size with 500px content is not going to damage me in any
way.

Mind you, I know there are those who feel any fixed width design is
absolutely wrong, those people will never be pleased. I feel fixed width
is a valid design decision in certain situations. And I have thought about
changing it to a fluid layout, but haven't been convinced yet it's worth
it.

[Alan J. Flavell]

On Sat, 7 Feb 2004, Neal wrote:

On Sat, 7 Feb 2004 01:20:48 +0000, Andy Mabbett
<us**********@pigsonthewing.org.uk> wrote:

You have a horizontal scroll bar at anything under 800px. This is good
because..?
It's good because users viewing at a browser width of over 800px see the
page as designed,

IMHO, that only proves that the page was not really designed for the
WWW.
The content width is 500px,
Pardon? How will that become evident on a speaking machine, or on a
text-mode browser. By implication, why _should_ that be specifically
evident on a graphical browser, when it's of no significance in other
browsing situations?

The truth is, you have no content in this page that is inherently
500px wide. Your claim is, pure and simple, a lie, inserted only to
justify a pointless design decision that you had already made
elsewhere.

Now, if you had a pixel-sized image containing vital detail that went
missing below 500px, then I could have accepted your claim. As it is,
the only person fooled by your claim seems to be yourself.
As this is not a commercial site per se, and is not geared to the
"experienced" web user, accommodating the rare user who runs their browser
at under 500px is not of high priority.
Sometimes I feel we are all speaking mutually incomprehensible
languages. Only the other day I was being told that transparent gifs
with

alt="for layout only"

were essential in order to conform with WAI accessibility requirements
for a page that had otherwise been designed to "look proffesional" (sic).

[...] If we're talking about a site
which is supposed to keep the visitor and turn the visit into profit, I
think an 800px size with 500px content is not going to damage me in any
way.
Pardon? I think you owe it to those in less-usual browsing situations
to justify what harm would come to your site from using flexible
design principles.

I reckon (no, I don't have the time to actually do it) that I could
produce a design that was effectively indistinguishable from your
botched pixel-based junk in the browsing situation that you had in
mind, yet adapted far better to a wide range of other browsing
situations.
Mind you, I know there are those who feel any fixed width design is
absolutely wrong, those people will never be pleased.
Oh, I see. That's how you come to terms with your inability.

Well, I take a different approach. I don't claim to be good at
everything, so I take advice from others.
I feel fixed width is a valid design decision in certain situations.
And I have thought about changing it to a fluid layout, but haven't
been convinced yet it's worth it.

That's the kind of problem that we're frequently up against, indeed.

In fact, your page works better on Lynx than on the normal graphic
browser that I use. I think there's a lesson there, though I doubt
that you will accept it.

[Neal]

On Sun, 8 Feb 2004 00:16:10 +0000, Alan J. Flavell <fl*****@ph.gla.ac.uk>
wrote:

On Sat, 7 Feb 2004, Neal wrote:

The content width is 500px,

Pardon? How will that become evident on a speaking machine, or on a
text-mode browser.

As these devices will not be affected by positioning styles, this is moot.
By implication, why _should_ that be specifically
evident on a graphical browser, when it's of no significance in other
browsing situations?

The truth is, you have no content in this page that is inherently
500px wide. Your claim is, pure and simple, a lie, inserted only to
justify a pointless design decision that you had already made
elsewhere.

Now, if you had a pixel-sized image containing vital detail that went
missing below 500px, then I could have accepted your claim. As it is,
the only person fooled by your claim seems to be yourself.
Let me clarify: The content <em>as displayed per my style directions</em>
appears as 500px wide. I didn't think I needed to spell that out, Alan.

If I set a div at a width of say 500px, isn't is true that either the UA
will render it at 500px wide, or the UA will not render that style
declaration? In the latter case, I have no control anyway, so my style is
of no consequence. If the former is true, then the only problems will be
apparent in browsers sized to under 500px wide.

If I am in error, I'd like to be set straight, as this is to my knowledge
how it works.

Certainly I agree that the only content which has an inherent width is an
image or similar object.
Sometimes I feel we are all speaking mutually incomprehensible
languages. Only the other day I was being told that transparent gifs
with

alt="for layout only"

were essential in order to conform with WAI accessibility requirements
for a page that had otherwise been designed to "look proffesional" (sic).
Well, you get no argument from me. That alt text is stupid.
[...]

If we're talking about a site
which is supposed to keep the visitor and turn the visit into profit, I
think an 800px size with 500px content is not going to damage me in any
way.
My actual full quote:

"If we're talking about a
site which is supposed to keep the visitor and turn the visit into profit,
I agree, accommodate as many
users as possible. But in this specific case, I think an 800px size with
500px content is not going to
damage me in any way."

Pardon? I think you owe it to those in less-usual browsing situations
to justify what harm would come to your site from using flexible
design principles.
I'm concerned with the width of the content. As a result of a fluid
design, the content area will be narrowed. As the navigation column takes
up some width by necessity, let's assume for the sake of discussion that
it works out to 20% of the user's viewport, that means a user with a
browser width of 500px will have a 400px content width. I believe this is
inferior to having mainly paragraphed content at a wider display. Some
users may believe differently.

Is it better to give the user flexibility in display? Yes. But must design
always cling to the ideal? No. In this design I have chosen, for right or
wrong, to use a fixed width. And I have indicated that I am considering
modifying that to a more fluid design. So I don't see why your undies are
in such a bunch. I'm not touting this page as the end-all of CSS design,
nor do I tout myself as any kind of expert. My goodness, if you're this
incensed over my little homepage design that isn't even finalized yet, how
can you bear to visit 95% of the sites on the web?
I reckon (no, I don't have the time to actually do it) that I could
produce a design that was effectively indistinguishable from your
botched pixel-based junk in the browsing situation that you had in
mind, yet adapted far better to a wide range of other browsing
situations.
I reckon I can as well. And I haven't had the time to actually do it
either. So it seems we have a few things in common.
Mind you, I know there are those who feel any fixed width design is
absolutely wrong, those people will never be pleased.

Oh, I see. That's how you come to terms with your inability.

Assumption that I am unable to do another layout is misplaced. To respond
to the anticipated, "Then why did you do it this way in the first place?",
I can only offer that I do not agree that fixed width is Evil and Wrong.
Well, I take a different approach. I don't claim to be good at
everything, so I take advice from others.

Alan, you KNOW I listen to others and learn a lot here. That was just
unfair.

I feel fixed width is a valid design decision in certain situations.
And I have thought about changing it to a fluid layout, but haven't
been convinced yet it's worth it.

That's the kind of problem that we're frequently up against, indeed.

In fact, your page works better on Lynx than on the normal graphic
browser that I use. I think there's a lesson there, though I doubt
that you will accept it.

On the up side, this post makes these cold New England winter days feel
like a Carribean vacation. Thanks for that.

I've said that I'm considering using a more fluid design. I've stated my
concerns with the fluid model in this case, whether you agree with them or
not. What more must I do, besides actually implement a design you are in
favor of?

[Darin McGrew]

Neal <ne*****@spamrcn.com> wrote:

If I set a div at a width of say 500px, isn't is true that either the UA
will render it at 500px wide, or the UA will not render that style
declaration? In the latter case, I have no control anyway, so my style is
of no consequence. If the former is true, then the only problems will be
apparent in browsers sized to under 500px wide.

If I am in error, I'd like to be set straight, as this is to my knowledge
how it works.

And what if the font size isn't what you expect?

Rendering "your style" isn't an all or nothing thing. And setting a
px-based width for text content doesn't adapt well to differing font sizes.
It doesn't adapt well to differing browser window sizes either, unless the
user style sheet overrides parts of "your style" (as mine does).
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

aquapella /"a-kw&-'pe-l&/ adj. sung in the shower

[Karl Smith]

Neal <ne*****@spamrcn.com> wrote:

I can only offer that I do not agree that fixed width is Evil and Wrong.

No, fixed widths are not Evil and Wrong, fixed widths are Right and
Proper. The most common readability problem with most websites is
their failure to set widths. What is evil and wrong is the
misunderstanding of how text is formed and how typographers measure
width.

Read a book, any book. You will not see text arranged in "content
DIVs", you will see paragraphs. Nor will you see pixels. Pixels are
relevant only to digitized images, they have nothing to do with text.

To make any randomly selected webpage easier to read, one of these:-
p {max-width: 39em}
is worth a thousand of these:-
div.content {width: 500px}
--
Karl Smith.

[Alan J. Flavell]

On Sat, 7 Feb 2004, Neal wrote:

On Sun, 8 Feb 2004 00:16:10 +0000, Alan J. Flavell <fl*****@ph.gla.ac.uk>
wrote:

On Sat, 7 Feb 2004, Neal wrote:

The content width is 500px,

Pardon? How will that become evident on a speaking machine, or on a
text-mode browser.

As these devices will not be affected by positioning styles, this is moot.

So what it boils down to is that your fixed pixel-sized presentation
proposal only rates to do harm on browsers which try to honour it. I
would draw certain conclusions from that observation!
Let me clarify: The content <em>as displayed per my style directions</em>
appears as 500px wide. I didn't think I needed to spell that out, Alan.
Oh, I think you do, as much to yourself as to anyone else. Andy
rightly criticised you for making a presentation proposal which caused
unnecessary horizontal scrolling (something which readers find
significantly annoying), and your justification for causing this
problem was "The content width is 500px". Naturally this gives the
impression that you're claiming some inherent merit in this
particular proposal, maybe because the content itself predicates such
a width, but now we learn that it's nothing more than a design choice
on your part - well, what we're trying to tell you is that it was a
sub-optimal design choice.
If I set a div at a width of say 500px, isn't is true that either the UA
will render it at 500px wide, or the UA will not render that style
declaration? In the latter case, I have no control anyway, so my style is
of no consequence.
Translation: "this style proposal may work better when it's ignored".
Again, I would draw a certain conclusion from that.
So I don't see why your undies are in such a bunch.

bye.

[Brian]

Karl Smith wrote:

Read a book, any book. You will not see text arranged in "content
DIVs", you will see paragraphs.

web <> book

(Yes, it seems trivial, but apparently needed mentioning.)

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Beauregard T. Shagnasty]

Quoth the raven named Brian:

Karl Smith wrote:

Read a book, any book. You will not see text arranged in "content
DIVs", you will see paragraphs.

web <> book

(Yes, it seems trivial, but apparently needed mentioning.)

Ah, you beat me to it.

Try dragging the corner of your book over there -->
so that the page gets larger. :-)

--
-bts
-This space intentionally left blank.

[Neal]

On Sun, 8 Feb 2004 11:00:25 +0000, Alan J. Flavell <fl*****@ph.gla.ac.uk>
wrote:

bye.

Before you disengage, view http://users.rcn.com/neal413 for the altered
verion.

Is it better? I'll leave it to the visitors to decide.

[Neal]

On Sun, 08 Feb 2004 12:31:39 -0500, Neal <ne*****@spamrcn.com> wrote:

On Sun, 8 Feb 2004 11:00:25 +0000, Alan J. Flavell
<fl*****@ph.gla.ac.uk> wrote:

bye.

Before you disengage, view http://users.rcn.com/neal413 for the altered
verion.

Is it better? I'll leave it to the visitors to decide.

Actually, it sucks at present. Will address in new thread.

[Brian]

Beauregard T. Shagnasty wrote:

Quoth the raven named Brian:

Karl Smith wrote:

Read a book, any book. You will not see text arranged in
"content DIVs", you will see paragraphs.
web <> book

Ah, you beat me to it.

:-p
Try dragging the corner of your book over there --> so that the
page gets larger. :-)

It doesn't work with my book. When I drag the corner, it just moves
the book to a new spot on my desktop. I wanted to complain to the
author, but clicking on the author's name didn't open up a letter with
the envelope already addressed.

Obviously, the book is broken. Maybe I need to upgrade to MS Book
version 4 or higher. ;-)

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Beauregard T. Shagnasty]

Quoth the raven named Brian:

Obviously, the book is broken. Maybe I need to upgrade to MS Book
version 4 or higher. ;-)

<LOL>

Sorry, MS Book V4 will be included in Longhorn, not released until
2006, and you will have to buy the whole bookstore to get it.

--
-bts
-This space intentionally left blank.

[Brian]

Beauregard T. Shagnasty wrote:

Quoth the raven named Brian:

Maybe I need to upgrade to MS Book version 4 or higher. ;-)

Sorry, MS Book V4 will be included in Longhorn, not released until
2006, and you will have to buy the whole bookstore to get it.

lol

I wonder what the security flaws are? If I use MS Book, will that give
intruders free access to my study?

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Andy Mabbett]

In message <op**************@news.rcn.com>, Neal <ne*****@spamrcn.com>
writes

You have a horizontal scroll bar at anything under 800px. This is
good because..?
It's good because users viewing at a browser width of over 800px see
the page as designed, and users using a browser width between 500 and
800px have to do a very small and unobtrusive amount of scrolling, and
gain a benefit from the content column not squishing too narrow as
would happen in a fluid design.

So, not good at all then :-(

[...]the rare user who runs their browser at under 500px is not of high
priority.

Your evidence that this is "rare" is..?
--
Andy Mabbett
"The Internet is a reflection of our society[ ...]. If we do not like what we
see in that mirror the problem is not to fix the mirror, we have to fix
society." Vint Cerf