NYCPHP Meetup

Wed Jan 10 10:55:42 EST 2007

Umm... and I a guru??  ;)
-Rob

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>Table to Div Test</title>
  <style type="text/css">
    html, body {
      height: 100%;
    }
    body {
      margin: 0;
      padding: 0;
    }
    #wrapper {
      min-height: 100%;
      margin: 0 auto;
      position: relative;
      width: 500px;
    }
    #top {
      background-color: red;
      height: 100px;
    }
    #middle {
      padding-bottom: 100px;
    }
    #bottom {
      background-color: blue;
      bottom: 0;
      height: 100px;
      position: absolute;
      width: 100%;
    }
  </style>
  <!--[if lt IE 7]>
  <style type="text/css" title="iehacks">
    #wrapper {
      height: 100%;
    }
  </style>
  <![endif]-->
</head>
<body>
<div id="wrapper">
  <div id="top">a</div>
  <div id="middle">hello</div>
  <div id="bottom">b</div>
</div>
</body>
</html>


Kenneth Downs wrote:
> Next time I'll put "simplified snippet" in bold 36pt, and I probably 
> should have included the standard disclaimer, "for illustrative 
> purposes" along with "strict compliance is left as an exercise to the 
> student".
>
> ...but if we're going to be picky, the best argument is working code, 
> how about somebody posts the DIV/CSS code that does the same thing?  
> I've heard from more than one person who has obviously read the blogs 
> that tell them to use CSS2, but nobody has yet supplied any working 
> code.   A lot of people helped me with this little problem, and now my 
> customers are enjoying the benefits, but none of that help came from 
> the nit-pickers.
>
> I'll be very happy to post a "And the HTML CSS guru is..." as soon as 
> somebody posts the CSS2 code that does the same thing.  I'll even buy 
> you a drink at Friday's after the next meeting.  This is not a nasty 
> I-don't-think-you-can-do-it challenge, its just that I'm not an HTML 
> guru, that's why I asked for help.  As soon as somebody can show the 
> code I'd be extremely happy, I'll use it from now on.  I'll be so glad 
> I'll buy you a drink.  Shoot, I even offered in the post to pay, and 
> nobody came up with anything.  The scientist in me wonders if it can 
> actually be done.
>
>
> tedd wrote:
>> At 9:46 PM -0500 1/4/07, Greg Rundlett wrote:
>>> On 1/4/07, Kenneth Downs <ken at secdat.com> wrote:
>>>> Hi folks,
>>>>
>>>> A helpful HTML guru has given me the solution to my height-dont-work
>>>> problem in IE 6.
>>>>
>>>> The guru is.... (drumroll)  Tom Melendez of LIPHP fame.  He pointed 
>>>> out
>>>> that changing the document type declaration to "quirks" mode makes IE
>>>> work, instantly fixing the problem.
>>>>
>>>> For completeness, here is a simplified snipeet that illustrates the
>>>> fixed situation:
>>>>
>>>> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
>>>> <html>
>>>> <head>
>>>>    <style>
>>>>    html, body {
>>>>       height: 100%;
>>>>       width: 100%;
>>>>       margin: 0px;
>>>>    }
>>>>    </style>
>>>> </head>
>>>> <body>
>>>> <center>
>>>>    <table cellspacing=0
>>>>           style="width: 500px; height: 100%;">
>>>>    <tr><td style="height: 100px" bgcolor=red>a </td></tr>
>>>>    <tr><td>hello </td></tr>
>>>>    <tr><td style="height: 100px" bgcolor=blue>b </td></tr>
>>>>    </table>
>>>> </center>
>>>> </body>
>>>>
>>>>
>>>
>>>
>>> I don't mean to be picky, but if you post a 'solution' then it ought
>>> to be or attempt to be syntactically correct.  The simple snippet
>>> above gets lazy about quoting attributes, ending semi-colons and the
>>> type attribute is even missing from the <style> tag not to mention a
>>> missing </html> tag.  Your point is made about doctype declarations,
>>> but the code example would lead a newbie to believe that tag soup is
>>> acceptable to 'gurus'.  All I had to do to produce the version below
>>> was run it through tidy -im -ashtml /tmp/tmp.html
>>>
>>> -snip-
>>>
>>> Greg
>>
>> Hi all:
>>
>> In addition, I don't mean to be picky either, but the example is: a) 
>> using a table to display other than table stuff; b) embedding css 
>> (nothing really wrong with it other than it could be made 
>> unobtrusive); c) placing design attributes within tags, which 
>> certainly belong in a css file; d) and, has an incomplete DOCTYPE.
>>
>> It's hard to do build something strong, when you have a poor foundation.
>>
>> tedd

NYCPHP Meetup

NYPHP.org

[nycphp-talk] And the HTML guru is....