Table issue

**chem3** · 01-12-2006, 06:45 AM

Hello,

I want to create a header-body-footer table for a web page, the header and footer are fine, but my problem is with the body section. I want to divide it into three cells and I want the middle cell to be 800 pixels in width and centered to the middle, and I want the left and right cells to take the rest of the remaining percent of the page width (if any). I don't want to make their width fixed in terms of pixels, but rather I want it to be in terms of percentage. (Each cell would have a width of: (100% - 800 pixels "width of the middle cell")/2 ) Is there any way to do that?

Here's the table's code:

HTML Code:

<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
  <!-- MSTableType="layout" -->
  <tr>
    <td valign="top" width="100%" height="100" colspan="3">
    <!-- MSCellType="ContentHead" -->
    &nbsp;</td>
  </tr>
  <tr>
    <td valign="top" width="???">
    <!-- MSCellType="NavBody" -->
    &nbsp;</td>
    <td valign="top" width="800" align="center">
    <!-- MSCellType="ContentBody" -->
    &nbsp;</td>
    <td valign="top" width="???">
    <!-- MSCellType="NavBody2" -->
    &nbsp;</td>
  </tr>
  <tr>
    <td valign="top" width="100%" height="100" colspan="3">
    <!-- MSCellType="ContentFoot" -->
    &nbsp;</td>
  </tr>
</table>

**Charles** · 01-12-2006, 06:51 AM

Tables are not for layout. Hie yourself to the CSS forum for the solution.

**chem3** · 01-12-2006, 06:55 AM

Originally Posted by Charles

Tables are not for layout. Hie yourself to the CSS forum for the solution.

But I am not good at CSS!
Isn't there any way to do that with my table above?

**Charles** · 01-12-2006, 07:04 AM

Obviously you're not that good at HTML either or you wouldn't be asking this question. Either the "tag soup" solution or the CSS one you're going to have to learn it. And if you're going to learn something you might as well learn the right one. Hie yourself to the CSS forum!

**Cytael** · 01-12-2006, 10:46 PM

There is indeed a way to do it with your table above, but here's the CSS, which is both more correct and should provide better results.

Code:

<html>
<head>
<style type="text/css">
#header { width: 100%; height: 100px; }
#content { margin: auto; width: 800px; }
#footer { width: 100%; height: 100px; }
</style>
<body>
<div id="header">Header</div>
<div id="content">Content</div>
<div id="footer">Footer</div>
</body>
</html>

Thread: Table issue

Thread Tools

Display

Table issue

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions