 | |
Two-column layout
Website Design comp.infosystems.www.authoring.site-design
 |
| | Thread Tools | Display Modes |
#1
 
| |||
| |||
|
Two-column layout -
09-19-2003
, 07:44 AM
#2
| |||
| |||
|
|
Also, is there a nice cross-browser approach which delivers two-column layouts in CSS, without resorting to table-layout? |
--
David Dorward http://dorward.me.uk/
#3
| |||
| |||
|
|
Philipp Lenssen wrote: Also, is there a nice cross-browser approach which delivers two-column layouts in CSS, without resorting to table-layout? Lots. http://dorward.me.uk/www/css/#templates links to bunches. |
crossbrowser two-column layouts implemented in CSS _exclusively_ -- in
the sense that I don't have to split up the HTML into separate divs
etc. ('cause I know how to do that already, but don't see a huge
advantage to using tables, once done that way -- still a small
advantage, yes).
--
Google Blogoscoped
http://blog.outer-court.com
#4
| |||
| |||
|
|
Philipp Lenssen wrote: Actually, I should have phrased it differently... are there any crossbrowser two-column layouts implemented in CSS exclusively -- in the sense that I don't have to split up the HTML into separate divs etc. Well, in that case, we'd need to see the markup. (Templates offered on the net are, by necessity, created with no content in mind.) |
<div class="content">
<p>This is some long text.
</p>
<p>This is some long text.
</p>
<p>This is some long text.
</p>
</div>
Now e.g. I would have different body-classes like:
<body class="news">
<body class="productDetails">
And then in my CSS I would write...
..news .content { different things }
..productDetails .content { columns: 3; }
.... where I don't care how complex the CSS will be.
But I'm afraid I would need to convert the actual source on the
server-side using some kind of clever template mechanism that will know
text-length and guess the height etc.
By the way, I'm not a fan of two-column-layouted text; in fact, I find
it to be an unnecessary hurdle to reading. So as ever so often this is
a technical question where I don't control the layout decision
completely.
Convincing somebody why two-column layout is bad were the base of my
other questions of this thread (e.g. usability studies by Nielsen & co).
Quote:
|
('cause I know how to do that already, but don't see a huge advantage to using tables, once done that way -- still a small advantage, yes). I respectfully disagree. Css layouts are more flexible. They can be changed by the author much more easily. More importanly, they can be altered by the user in a way that tables cannot. And they don't interfere with the content (when authored correctly, of course). |
(e.g. image next to text) I could come up with was something like...
<div class="picAndText">
<div class="pic"><img ...></div>
<div class="text"><p>...</p></div>
</div>
I can get this to work in NS4 etc. and for every different browser it's
a bit of a pain, but it works, yeah.
Yes, personally I'd prefer this to e.g. ...
<table>
<tr><td><img ...></td></tr>
<tr><td><p>...</p></td></tr>
</table>
.... but it's not really much much better. Almost not good enough to be
a convincing argument to others.
--
Google Blogoscoped
http://blog.outer-court.com
#5
| ||||||
| ||||||
|
|
The problem is that certain browsers, especially MSIE/Win, are limited in their css abilities. Css 2 selectors can be used to access the elements and manipulate them. .productDetails .content P { } /* 1st p element in #content */ .productDetails .content P + P { }/* 2nd p in #content */ .productDetails .content P + P + P { }/* 3rd p in #content */ |
Wasn't there once a browser-specific mutli-column HTML element? I
remember having used something like it years ago in whatever context
(test page), but then again, maybe I'm just getting confused.
Quote:
|
There is good reason not to try to make 3 columns on a web page, since you don't know the properties of the display mechanism. So the question is, why do you want this? Answer is likely: the client wants it. Well, one should try her or his best to explain to the client why that is difficult and inadvisable. If you simply say, "that can't [or should not] be done," they may get frustrated. Perhaps giving reasons will help them accept this fact as an advantage, rather than perceived as a limitation. |
tables)... of course there's a 100 things which are also table-layouted
but the
several-columns-can't-be-done-totally-easy-even-in-some-more-modern-brow
sers argument (phew) is a good one.
Quote:
|
Perhaps this is why you argue that there is not much of an advantage to proper markup (div, p, etc) over improper markup (table, td, etc.)? |
simple table are a little too much for something that should ideally be
implemented in CSS. The less you gain from using CSS the higher the
risks (e.g. NS4 risks) weigh.
Quote:
|
What's wrong with the following? div class="picAndText" img ... p>...</p /div |
not-<div>. Like, it's basically ignoring <img> for most things one
might want to do.
Quote:
|
I can get this to work in NS4 Increasingly, authors are giving up on css and NS4. |
take 5 minutes to either exclude NS4 completely from CSS-layout, or
find an easy way to fix the most obvious problems in its display by
some minor CSS-workarounds. Actually, I don't care about NS4. Except
that at work, my client's company has this as default browser.
Quote:
|
Perhaps my audience was more receptive than most would be. But in any case, this is a different question. Is proper markup better than improper markup? Of course. Is it easy to convince a layperson of this? I don't know the answer to that. |
marketing...
--
Google Blogoscoped
http://blog.outer-court.com
|
« Previous Thread
|
Next Thread »
| Thread Tools | |
| Display Modes | |
Linear Mode
| |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.