CSS layout dilemma

[Spartanicus]

According to this very newsgroup, IE sometimes has trouble with floats

Every browser has float bugs, including the latest and greatest. There
is a huge number of different float bugs across different browsers and
browser versions. Unfortunately floats are abused all over the place by
many in an attempt to circumvent IE's CSS shortcomings.

The float bugs combined with the fundamental unsuitability of using
floats for anything else than their intended purpose [1] is probably the
biggest source of frustration amongst budding CSS authors.

[1] Left or right aligning an element and have text flow around it.

 

[Dave Smey]

#eventbox {width: 575px; background-color: #FFFFFF; border-width: 2px;
border-top-style: solid; clear: left;}
#infobox {width: 340px; float: left; background-color: #FFFFFF;
padding-left:10px; padding-right:10px; padding-top: 10px}
#photobox {width: 205px; float: right; background-color: #FFFFFF;
padding-right:10px;}

Almost done. For the record, floating one box left and the other right
caused more hideous problems in Firefox, but (counterintuitively) floating
both of them left worked like a charm.

If anybody cares, it's temporarily at
www.davesmey.com/miller
Just the content in the middle is mine. I'd be curious, actually, to what
extent I am over-reliant on divs. It's pretty much the only thing I know
how to use.

 

[Neredbojias]

With neither quill nor qualm, Spartanicus quothed:

According to this very newsgroup, IE sometimes has trouble with floats

Every browser has float bugs, including the latest and greatest. There
is a huge number of different float bugs across different browsers and
browser versions. Unfortunately floats are abused all over the place by
many in an attempt to circumvent IE's CSS shortcomings.

The float bugs combined with the fundamental unsuitability of using
floats for anything else than their intended purpose [1] is probably the
biggest source of frustration amongst budding CSS authors.

[1] Left or right aligning an element and have text flow around it.

Yes. Between my previous message and this one, I did a little fooling
around with floats and became one frustrated fuzz-stuffer. I agree with
your statement/conclusion quite heartily. (Ironically, in several
variations it actually seemed that IE executed floats more standards-
correct, thought not completely so, than did Mozilla.)

 

[Neredbojias]

With neither quill nor qualm, Dave Smey quothed:

Almost done. For the record, floating one box left and the other right
caused more hideous problems in Firefox, but (counterintuitively) floating
both of them left worked like a charm.

If anybody cares, it's temporarily at
www.davesmey.com/miller
Just the content in the middle is mine. I'd be curious, actually, to what
extent I am over-reliant on divs. It's pretty much the only thing I know
how to use.

I didn't get into the markup to see what you're floating and what you're
sinking but I like the page itself. It's simple, attractive, and
effective - a good formula to follow in web page crafting.

 

[Spartanicus]

(Ironically, in several
variations it actually seemed that IE executed floats more standards-
correct, thought not completely so, than did Mozilla.)

That's unlikely, but it does point to another problem with floats, their
usage is not intuitive. IE is known to render more in line with what a
less experienced author expects. Mozilla is more likely to render
according to the CSS specification, and the CSS rules for floats are
sometimes bizarre, and often counter intuitive.

 

[Dave Smey]

I didn't get into the markup to see what you're floating and what you're
sinking but I like the page itself. It's simple, attractive, and
effective - a good formula to follow in web page crafting.

Hey, glad you liked it. All credit goes to the original designer years
ago - my job was simply to replace the content. Though I'm happy to have
gutted the original code (which was all tables and spans) and replaced it
with my own divs and CSS. It was daunting for me since I'm just an amateur.

Actually, you might enjoy signing up for the Miller mailing list, just to
get the brochure. In my opinion it's the best-designed performing arts
literature in New York City (done by Alex Coulter.)

http://www.millertheatre.com/

 

[Barbara de Zoete]

[ Why is it so hard to properly attribute the quotes? ]

Should have taken a peek at the markup.

No, it's not. It's not readable, so how can it be attractive. For one, the font
size of the main text is far too small to read comfortably. Secondly, the blue
of the menu in the top of the page has hardly any contrast with the gray
background of the top, so that without images one cannot read the menu items.
Bad overall design decissions in all.

Hey, glad you liked it. All credit goes to the original designer years
ago - my job was simply to replace the content. Though I'm happy to have
gutted the original code (which was all tables and spans) and replaced it
with my own divs and CSS. It was daunting for me since I'm just an amateur.

There are still tables around where there shouldn't be any. And also: all that
div abuse. Ugly. Really ugly. Why don't you mark up paragraphs as paragraphs,
headings as headings and so on? What's with all those div's? A div is an element
you use if the doctype you choose to go with doesn't hold a block level element
you need. Like you would only use a span if there is no appropriate inline
element around in the doctype of choice.

Actually, you might enjoy signing up for the Miller mailing list,

<spam snipped>

Hang on. If people mention they like your design in a group that is about
markup, that doesn't give you any excuse to start spamming the place.

--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'

 

[Dave Smey]

There are still tables around where there shouldn't be any.

As I made pretty clear, those aren't mine. It used to be all tables.

And also: all that
div abuse. Ugly. Really ugly. Why don't you mark up paragraphs as paragraphs,
headings as headings and so on? What's with all those div's? A div is an element
you use if the doctype you choose to go with doesn't hold a block level element
you need. Like you would only use a span if there is no appropriate inline
element around in the doctype of choice.

Well this was the question, actually. If I understand you correctly, you
are saying that I could have, for instance, defined <p> in my CSS and thus
avoided all the "bigP" and "smallP" divs. How exactly do you write that,
something like this...

infobox.p {blah blah}

This is the part I have not learned yet. It's pretty unclear what else in
the format I could have defined, though, to avoid more divs. (img, perhaps,
can't see what else.)

<spam snipped>

Hang on. If people mention they like your design in a group that is about
markup, that doesn't give you any excuse to start spamming the place.

Hey, they guy was talking design and I responded in kind, giving Alex (who I
think was the original designer and does extremely good print work) some
props. It provoked you into sending me some semi-useful information that I
actually asked for, so I win.

Speaking of useful information, I really like
http://www.newyorker.com/
don't you? I read it every week. Also, this:
http://www.nytimes.com/

 

[Barbara de Zoete]

[ Start attributing the quotes, dumbass! ]

As I made pretty clear, those aren't mine. It used to be all tables.

I don't care. Those tables are still there and they shouldn't be. You present
the page, not the original developer. So you get to here what's good and bad
about it.

Start using a newsclient that doesn't break so easily on longer lines as yours
does.

Well this was the question, actually. If I understand you correctly, you
are saying that I could have, for instance, defined <p> in my CSS and thus
avoided all the "bigP" and "smallP" divs. How exactly do you write that,
something like this...

infobox.p {blah blah}

Write correct markup. Use the elements you use in your pages as selectors in
your stylesheets.

This is the part I have not learned yet. It's pretty unclear what else in
the format I could have defined, though, to avoid more divs. (img, perhaps,
can't see what else.)

Start by creating pages with correct (meaningfull that is) markup. What's so
hard to understand? That a paragraph should be marked up as such? And a heading
as a heading? First learn how to use html properly. A properly created page will
give you probably all the selectors for your stylesheet. Or most of them.

Hey, they guy was talking design and I responded in kind, giving Alex (who I
think was the original designer and does extremely good print work) some
props. It provoked you

No it didn't. If something really provokes me, the poster gets plonked. Usually
without worning. I just thought you could do with some advise.

into sending me some semi-useful information

'semi-useful'? If things keep unclear, ask further. I'm not a helpdesk support
person thingy girl et cetera. I'm not here to help you. I merely broke into a
discussion that was going the wrong direction IMO. The one poster says that he
liked the design. I pointed out it sucks because it is unreadable for many
people. Sucks.

that I
actually asked for, so I win.

Ah, you think it is about winning and loosing. And here I thought it to be a
discussion of some sort, like what usenet is all about.

Speaking of useful information, I really like

< spam snipped >

plonk



--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'

 

[Dave Smey]

[ Start attributing the quotes, dumbass! ]

nice. I refuse.

I don't care. Those tables are still there and they shouldn't be. You present
the page, not the original developer. So you get to here what's good and bad
about it.

I know it is bad code, of course. But I don't have time to mess with it,
nor will I get paid to do so. So of course I don't care to "here" about it.

'semi-useful'? If things keep unclear, ask further. I'm not a helpdesk support
person thingy girl et cetera. I'm not here to help you.

Right. Not unclear so much as un-useful. To anybody, at this point.

I merely broke into a
discussion that was going the wrong direction IMO.

Netcop. the thread was over, obviously.

Ah, you think it is about winning and loosing. And here I thought it to be a
discussion of some sort, like what usenet is all about.

plonk

Ah you are right. This is indeed what usenet is all about. Plonked, I
dissolve into oblivion.