[CLUE-Tech] Using CSS to get an HTML table effect.

Mike Staver staver at fimble.com
Tue Oct 28 16:57:54 MST 2003


Jed, this is how I would do it:

<html>
<body bgcolor="ffffff" leftmargin="0" topmargin="0" marginwidth="0" 
marginheight="0">
<table border="0" bgcolor="ffffff" width="100%" cellpadding="0" 
cellspacing="0">
<tr>
<td width="233" bgcolor="babfa0">
little bit of content
</td>
<td rowspan="2">
Other content, which takes up much more space
  vertically than the sidebar
</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</html>


 From what I can see in your example, the code that I put there should 
accomplish the exact same thing, but be compliant in a lot of browsers 
equally.

Jed S. Baer wrote:

> Hi Folks.
> 
> I've read in a few places that it should be (is) possible to use CSS and
> the <div> tag to do nearly everything you can do with table tags. So, I'm
> trying be all progressive, and and use CSS to create a 2-column html page,
> where column 1 has a different background color from the body, and is the
> full height (minus margins) of the page.
> 
> Trying various things, including sample code from the CSS2 specification.
> Here's some  abbreviated code:
> 
> div.sidebar {
>   background-color: #babfa0;
>   width: 233;
>   float: left;
> }
> 
> <html>
> <body>
> <div class="sidebar">
> little bit of content
> </div>
> Other content, which takes up much more space
> vertically than the sidebar
> </body>
> </html>
> 
> Obviously, the float accomplishes only having the other content wrap
> around the div block. The sidebar div has a height computed based on its
> content. What I want is to have it's height equal to the height of the
> page, which I had thought I could get with "height: inherit;" which
> according to the docs causing inheritance from the enclosing block.
> Apparently, the enclosing block is something other than the entire web
> page here. "height: 100%;" doesn't work either.
> 
> The CSS example used 2 divs, each with a "position: fixed;", and a little
> drawing showing page arrangement which looked just like what I wanted
> (except for the background color thing). Well, using their code, the
> background color of the left div still fills only to the height of the
> content.
> 
> Suggestions appreciated.
> jed

-- 

                                 -Mike Staver
                                  staver at fimble.com
                                  mstaver at globaltaxnetwork.com




More information about the clue-tech mailing list