Layout using CSS vs. tables

[Michael Winter]

The [rendering] results using DIVs was very pleasing (to me) in every
browser except MSIE, so I am back to showing the tables based pages
until I fix whatever was wrong.

Start by reviewing the validator results that bts posted[1] (and
implement his other remark, too). A hash (#) is not a comment delimiter
in CSS. Only C-style (/* ... */) delimiters are recognised.

As you're probably aware, there are still improvements that can be made
to your markup. A few include:

- Remove in-line style declarations. Use semantic elements
(when available) and appropriately-named classes.
- Your 'subheader' DIV elements should be replaced by header
elements (H2). Your current header should be level-one (H1).
- Values for id and class attributes should convey meaning.
#footerN (where N is a number) doesn't qualify. In order,
they should be along the lines of 'translations', 'address',
'contact-information', and 'bank-account' (assuming I
understood them).

It's a good first step, though.

As for the Danish (and British) flag:
<http://www.cs.tut.fi/~jkorpela/flags.html>

Mike


[1] <[email protected]>

 

[Bernhard Sturm]

Duplicate id attribute values. The inner DIV element should be
identified with a name like 'content'.

Probably just an oversight.

arrrgghh.. you are right... and 'content' was indeed my intention. I
also forgot to add a footer dummy content.. thanks for mentioning it!

 

[=?ISO-8859-1?Q?G=E9rard_Talbot?=]

Malte Christensen wrote :

I absolutely agree with what J. Little writes exactly here. Your
webpage, Malte, is very poorly structured, is semantically wrong and
does not show an example of good, sound webpage design. Using table to
layout elements in a webpage when there is no tabular data involved is
bad semantic to begin with, even though it might be using valid markup code.

I

As I said initially, I wasn't out to start a war ;-)

We're not at war either: we're talking, discussing in a newsgroup
discussion without making insults, bashing, personal/ad hominem remarks,
you know.

I read all of the responses, went to all the sites, and made up my mind
to use CSS.

Which sites did you go?

The interim results after 3 hours are at www.nmalte.dk. I am very
pleased with the clarity that this design results in, even if probably
everything could be improved.

You're using nested tables at nmalte.dk site! It's even worse than plain
table use for layout. Converting such site into a CSS flexible/fluid 2
column design would be easy.

That I am not exactly a graphics designer

is also clear...

We're not either: what's the point anyway?

But heck, writing Java code is more fun anyway

Constructive criticism always welcome. My mail address is on the site.

http://www.gtalbot.org/NvuSection/NvuWebDesignTips/WebDesignResources.html#CSSWebpageTemplates

Gérard

 

[Stan McCann]

Malte Christensen wrote :

This is something that I warn my students about, especially the older
folk as we grew up in a paper world and it can be very difficult to
achieve proper seperation for us.

This isn't an excuse, just a warning that us older folk must be more
conscious of our tendencies. The younger people that have grown up
with the computer screen medium better understand it's flexibility
making it a bit easier to look at something and immediately think of it
as what it is rather than how it looks.

http://www.gtalbot.org/NvuSection/NvuWebDesignTips/WebDesignResources
.html#CSSWebpageTemplates

Nice work Gérard. I'll share that link with my students if you don't
mind.

 

[Malte Christensen]

Malte Christensen wrote :




I absolutely agree with what J. Little writes exactly here. Your
webpage, Malte, is very poorly structured, is semantically wrong and
does not show an example of good, sound webpage design. Using table to
layout elements in a webpage when there is no tabular data involved is
bad semantic to begin with, even though it might be using valid markup
code.

I



We're not at war either: we're talking, discussing in a newsgroup
discussion without making insults, bashing, personal/ad hominem remarks,
you know.




Which sites did you go?




You're using nested tables at nmalte.dk site! It's even worse than plain
table use for layout. Converting such site into a CSS flexible/fluid 2
column design would be easy.

That I am not exactly a graphics designer



We're not either: what's the point anyway?

But heck, writing Java code is more fun anyway



http://www.gtalbot.org/NvuSection/NvuWebDesignTips/WebDesignResources.html#CSSWebpageTemplates


Gérard

Thank you for your comments. As earlier posts show, the current pages
are the OLD ones put back on why I figure out why the NEW ones won't
show in MSIE.

 

[Michael Winter]

Malte Christensen wrote :

I absolutely agree with what J. Little writes exactly here. Your
webpage, Malte, [...]

You might want to look at what you quoted again more carefully, or look
back through the thread. Jonathan didn't write that paragraph, Bernhard
did and it was in response to Chaddy2222, not the OP.

[M. Christensen:]

You're using nested tables at nmalte.dk site!

Again, if you check the thread, it seems that the site underwent change
during the discussion: a revised Strict version was uploaded, but
because it rendered badly in IE, is was moved to
<http://www.nmalte.dk/index.htmlcss>.

Though this latter document does need improvements, and I'm sure your
post was, in hindsight, a simple misunderstanding on your part, I think
you may owe the OP an apology.


To the OP: I forgot to add in my other post that your 'About Me' section
is littered with self-closing paragraphs (<p/>). These are legal in both
HTML and XHTML (though with very different meaning in the former), so
they won't show up as errors when validating, but should be removed or
corrected. I suspect you meant to add actual paragraphs to contain the
content after each 'heading'.

Mike

 

[Malte Christensen]

To the OP: I forgot to add in my other post that your 'About Me' section
is littered with self-closing paragraphs (<p/>). These are legal in both
HTML and XHTML (though with very different meaning in the former), so
they won't show up as errors when validating, but should be removed or
corrected. I suspect you meant to add actual paragraphs to contain the
content after each 'heading'.

Mike

Again, very good advice. Thank you very much.

Can of worms, this CSS stuff, but I'll get it sorted.

Cheers,

Malte

 

[Nije Nego]

:
: I personally use Tables for layout, mainly because they are easyer,
: well kind of.
:
You should reply:

"... because I don't know how to use CSS well..." but than you would not
reply where you do not know much about.

 

[Neredbojias]

With neither quill nor qualm, Malte Christensen quothed:

Very true, and that is what I am attempting. The results using DIVs was
very pleasing (to me) in every browser except MSIE, so I am back to
showing the tables based pages until I fix whatever was wrong.

Remember this: whatever is "wrong" may not really be _wrong_; it might
simply be a case of mis-rendering in the poorly-compliant IE.

Also, I have no qualms about using tables over "esoteric" css layouts (-
which usually don't work in all browsers, anyway,) but have found that
most of the time simple css will suffice for the majority of designs
even considering the IE bugs.