CSS vs Tables

[Beauregard T. Shagnasty]

Re: CSS vs Tables

Simon Dean wrote:

It does. Thank you very much. I note that the right hand column comes
before the centre column. And it works with less text too!

Some feel that it is more appropriate to have the content appear first
in the source, for search engines. It could be an advantage if they
don't have to read your menu, links, and possible repeating sidebar on
every page before getting to the "meat" of the page.

See this one; content is first, menu and sidebar last.

http://benmeadowcroft.com/webdev/csstemplates/3-column.html

--
-bts
-Motorcycles defy gravity; cars just suck

[John Hosking]

Re: CSS vs Tables

Spartanicus wrote:

John Hosking wrote:
>

>>I had the impression when I first read this, that you were maybe looking
>>for some way to specify, say, a width of 20em + 3px + 3px. Which would
>>be pretty damn useful sometimes. But you can't do it that way.

>
Indirectly you can by specifying a width in em combined with a left
and/or right padding in px. This results in a width of Xem + Ypx due to
CSS box model rules. In instances where you don't actually want the
padding you can then use a negative margin on the box's content wrapper
to correct that.
>

Ah, very cute. Thanks.

--
John

[dorayme]

Re: CSS vs Tables

In article <4t863uF12o7aaU 1@mid.individua l.net>,
Simon Dean <sjdean@simtext .plus.comwrote:

Martin Eyles wrote:

"Simon Dean" <sjdean@simtext .plus.comwrote in message
news:4t6if6F129 enjU1@mid.indiv idual.net...

>

I have not yet seen a solution.

I threw this together in a few minutes, and it does what your table
attempts, using divs and css. Very unrefined, but appears to work in
IE6, IE7 & Firefox 2.

>
[snip]
>
JC! Thanks! Exactly what I was looking for. You're my hero! How can I
repay you?

It is quite surprising how effective some direct spoonfeeding can
be! There should be more of it.

--
dorayme

[Gérard Talbot]

Re: CSS vs Tables

Simon Dean wrote :

Have you got a link you can send me to that might
explain these?

Table-based webpage design versus CSS-based webpage design: resources

http://www.gtalbot.org/NvuSection/NvuWebDesignTips/TableVsCSSDesign.html

Best resource in my opinion is:
Why tables for layout is stupid. Problems defined, solutions offered.

http://www.hotdesign.com/seybold/

Why should I use CSS layouts over tables?

http://www.html-faq.com/csspositioning/?csslayout

Gérard
--
remove blah to email me

[Gérard Talbot]

Re: CSS vs Tables

Simon Dean wrote :

[snipped]

There has not yet been (as far as I
have seen), any reference to the magic second column that automagically
expands like a table might...

3 Column Layout

http://examples.tobyinkster.co.uk/3col

[snipped]
(...)

but how to achieve the two fixed outer columns with a
magically expanding second column that expands to browser window size.

Skidoo : 2 or 3 Column Layout

http://webhost.bridgew.edu/etribou/layouts/skidoo/index.html

Gérard
--
remove blah to email me

[Gérard Talbot]

Re: CSS vs Tables

Simon Dean wrote :

[snipped]

There has not yet been (as far as I
have seen), any reference to the magic second column that automagically
expands like a table might...

The "I can't believe it's not a table!" layout

http://www.positioniseverything.net/threecolbglong.html

[snipped]

but how to achieve the two fixed outer columns with a
magically expanding second column that expands to browser window size.

Three Column Stretch (header)

http://www.positioniseverything.net/thr.col.stretch.html

Simon, there are **lots** of webpages implementing what you were looking
for with divs (instead of table) with the central column being
stretchable/expandable/shrinkable.

You have a choice between resorting to floats or to go with abs.
positioning: both choices can have/imply some problems with some browser.

E.g.: if you use floats, you'll have to use some hacks for IE 5, IE6 and
IE7 since many float bugs have not been fixed yet. If you use abs. pos.,
then IE users will have considerable problems with text selecting (which
I think is less of a problem than having to endure with hacks for
floats... just my opinion).

Gérard
--
remove blah to email me

[Gérard Talbot]

Re: CSS vs Tables

Bergamot wrote :

Simon Dean wrote:

>There has not yet been (as far as I
>have seen), any reference to the magic second column that automagically
>expands like a table might...

>
You didn't look very hard.

I also think it's fair to say that Simon did not look very hard.

There are many 3-column templates that do
this, several are listed at
http://css-discuss.incutio.com/?page=ThreeColumnLayouts

Some (many?) of these 3-column templates are debattable, questionable.
Some do not use valid markup code; some use rather ugly hacks; some even
rely on javascript. That page mentions "The judgment of 'good' is left
to you and your needs. Each offers interesting techniques for the CSS
student."

In my opinion, many web developers are being "blocked", stuck with IE 6
and IE 7 browser versions which can not render some CSS templates
accordingly due to IE bugs and some hacks are unavoidable. Microsoft is
to be blamed entirely for this very deplorable and frustating situation.

Gérard
--
remove blah to email me

[Saul]

Re: CSS vs Tables

It does. Thank you very much. I note that the right hand column comes

before the centre column. And it works with less text too!

>
Some feel that it is more appropriate to have the content appear first
in the source, for search engines. It could be an advantage if they
don't have to read your menu, links, and possible repeating sidebar on
every page before getting to the "meat" of the page.
>
See this one; content is first, menu and sidebar last.
http://benmeadowcroft.com/webdev/css.../3-column.html

Style sheets with absolute positioning cause lots of problems in
small-format browsers as text and images will run into one another on
small screens or shrunken windows and for me really ought to be avoided
- unreadable text is as inaccessible as badly marked up text.

If you don't use absolute positioning then you have to have the 'wrong'
semantic order to the page to get floats to work correctly. This is
style imposing constraints on content when the two really should be
totally separate. I'm hoping that at some point in the future this CSS
feature/bug will be corrected for, but until then floats remain a
layout hack as much as tables are a layout hack, and in some
circumstances the table hack is better than the CSS equivalent hack.


Saul

https://www.notanant.com

[Andy Dingley]

Re: CSS vs Tables

VK wrote:

May I ask what browser did you enjoy this layout on? Definitely not on
NN3/IE3 or NN4/IE4 :

While what you say is true, it's so thoroughly obsolete to be of no
remaining interest. Who cares about NS4 ?

[Bergamot]

Re: CSS vs Tables

Saul wrote:

>
If you don't use absolute positioning then you have to have the 'wrong'
semantic order to the page to get floats to work correctly.

Not true. You probably just need an additional container somewhere.

--
Berg

[Saul]

Re: CSS vs Tables


Bergamot wrote:

Saul wrote:

If you don't use absolute positioning then you have to have the 'wrong'
semantic order to the page to get floats to work correctly.

>
Not true. You probably just need an additional container somewhere.

I'd be interested in a demonstration. We've tried all sorts to get this
type of approach to work and with absolute posiitiong we always have
run into problems with text running into images or text running into
text as the page size decreases (as the previous example link
demonstrates). Things like min-width and max-width aren't safe across
browsers and so can't be used.

Saul

https://www.notanant.com

[Bergamot]

Re: CSS vs Tables

Saul wrote:

Bergamot wrote:
>

>Saul wrote:

>
If you don't use absolute positioning then you have to have the 'wrong'
semantic order to the page to get floats to work correctly.

>>
>Not true. You probably just need an additional container somewhere.

>
I'd be interested in a demonstration. We've tried all sorts to get this
type of approach to work and with absolute posiitiong

I was referring to using floated containers, not absolute positioning.
There are already 3 column templates out there that use the "correct"
semantic order. Some are no doubt listed at

http://css-discuss.incutio.com/?page=ThreeColumnLayouts

--
Berg

[VK]

Re: CSS vs Tables


Bergamot wrote:

I was referring to using floated containers, not absolute positioning.
There are already 3 column templates out there that use the "correct"
semantic order. Some are no doubt listed at
http://css-discuss.incutio.com/?page=ThreeColumnLayouts

So is there a single layout in there you would suggest into commercial
production? I tried 6 of them going from the top and then 3 more by
random choice. All 9 have at least one un-acceptable default (not
talking about combinations):
1) ugly as hell on font size change in at least one of major UAs
2) locking font size change in at least one of major UAs
3) simply ugly with any font size
4) totally obfuscated DIV-soup where any JAWS will loose its teeth.

I'm not saying the list doesn't have a perfect layout: but could you
point to it?

[Bergamot]

Re: CSS vs Tables

VK wrote:

>
I'm not saying the list doesn't have a perfect layout: but could you
point to it?

I'm not inclined to do your research for you, at least not for free.

--
Berg

[Bergamot]

Re: CSS vs Tables

Bergamot wrote:

VK wrote:

>>
>I'm not saying the list doesn't have a perfect layout: but could you
>point to it?

>
I'm not inclined to do your research for you, at least not for free.

re: http://css-discuss.incutio.com/?page=ThreeColumnLayouts

I decided to spoon feed you after all. After scanning the descriptions
(you apparently didn't bother reading them), I found one that does what
Saul said couldn't be done using floats. Took all of 20 seconds to spot.

http://www.ground.cz/luci/css/my3cols.html

Please, before you start complaining about its vast number of flaws and
deficiencies, use a little common sense. Those templates are mostly
intended to be used as guides, not taken as is unmodified. They are
learning tools. Use them as such.

If you don't have the imagination to replace px widths with ems or
change other CSS rules to your own liking, then you need a lot more help
than I am willing to give.

--
Berg