Previous Message
Next Message

Box Model Hack, then & now: EMoC

Sent by Lorin Rivers on 21 January 2005 01:01


On Dec 3, 2004, at 8:49 AM, Eric A. Meyer wrote:

> At 12:32 +0000 12/3/04, Bob McClelland wrote:
>
>> Thanks to all who responded. The reason I'm labouring the point here 
>> is
>> because the very simple styling:
>>
>>         width : 450;
>>         w\idth : 400;
>>
>> type of thing works for me (IE 5.5, IE6, quirks and standards, 
>> Mozilla 1,
>> Firefox 1, Opera 7), so why should I use anything else?  Michael 
>> (Wilson)
>> suggested adding an extra line (which is OK):
>>
>>     width: 400px;
>>     \width: 450px;
>>     w\idth: 400px;
>>
>> but Zeldman and others suggest using the clumsy voice things.  I ask 
>> myself
>> why, if the simple things do actually work  properly?
>
>    I can't speak for others, but I can for myself.  The first thing to 
> remember is that Zeldman, or anyone else, may have once suggested 
> something that they wouldn't still suggest.  For example, I know there 
> are documents out there with my name on them that recommend using 
> 'link' to associate basic, NN4.x-friendly styles to the document, and 
> '@import' to bring in the more advanced stuff that IE5.0 can handle.  
> I would no longer recommend doing that.  Still, someone who read one 
> of those 1998-era documents this morning might think I do.  There's a 
> difference between "did" and "do" that the Web, and indeed any form of 
> publication, can blur.
>    So, on to the specific topic at hand.  The 'voice-family' hack was 
> the first of the parsing-bug hacks, and it was (in a word) brilliant. 
> Some would add the word misguided, but I'm not one of them.  At a time 
> when IE/Win had no standards mode, and when its box model 
> interpretations differed from every other CSS-aware browser on the 
> market, the BMH solved a crying need.  What's more, it was all valid, 
> future-compatible CSS.  That's most of the reason I call it brilliant.
>    So its use spread far and wide.  Asking why people used the 
> original BMH is like asking why people ever used punch cards to write 
> computer programs.  At the time, there was no other choice.[1]  Now we 
> have the SMBH, child selector hacks, and a whole slew of tools at our 
> disposal.  The old-timers, of course, keep plodding along using the 
> same archaic tools they learned back in the day.  ("COBOL was good 
> enough in 1974, and dern it all, it's good enough today!")
>    Although I should point out that this old-timer has switched over 
> to using child-selector hacks of late, because of the failure of the 
> BMH in quirks mode in IE6.  I may move to the SBMH, which should 
> actually be the ECH (Escaped Character Hack), but I still experience 
> lingering resistance because I don't entirely understand all its 
> ramifications.  I don't like using hacks I don't fully understand.
>    Now, stop that snickering, or I'll mash your toes with my walker 
> when you aren't looking.
>
>
> [1] Which is, I admit, not a perfect analogy.  At the time the BMH 
> came out, you could use Microsoft's Conditional Comments to feed 
> IE/Win special values, just as you can today.  There were reasons to 
> prefer one or the other; most of us in the standards community took to 
> the BMH.  Good or bad, that's how things unfolded.

First, let me say this list is such a godsend.
Second, Eric, thanks for this book which has been a huge help for me 
_understanding_ css, rather than copying and pasting it...

OK, so all that said, how would you write these rules (From EMoC, 
Project 13) were you writing it today?
div.note {float: right; clear: right; border-width: 0;
   width: 18%; margin: 0 1% 0 0; padding: 0;
   text-align: right; font: 80% Arial, Verdana, Helvetica, sans-serif;
   background: transparent url(blue.gif) 50% 15px repeat-x;
   voice-family: "\"}\""; voice-family:inherit;
   width: 19%;}

and

div.caption {float: right; width: 30%; margin: 0 1% 0 0;
   padding: 0 0 0 40%;
   border-top: 1px solid #006;
   voice-family: "\"}\""; voice-family:inherit;
   width: 19%; padding-left: 10%;}

I've been trying to use the * html hack, but it's not quite working in 
Safari...

Thanks!
-- 
Lorin Rivers
Mosasaur: Killer Technical Marketing <http://www.mosasaur.com>
[EMAIL-REMOVED]>
512/203.3198 (m)

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread:

Possibly related: