Posted by Chris Beall on 08/12/05 06:00

nightstar@gmail.com wrote:

> Hello,
>
> I have been working with CSS for some little time now and have a
> conversion that needs to be done. We are supposed to convert (to divs)
> a table very similar to:
>
> <table width="100%">
> <tr>
> <td>Header Left</td>
> <td>Header Center</td>
> <td>Header Right</td>
> </tr>
> <tr>
> <td colspan="3">Section 1</td>
> </tr>
> <tr>
> <td colspan="2">Section 2</td>
> <td>Section 3</td>
> </tr>
> <tr>
> <td>Footer Left</td>
> <td>Footer Center</td>
> <td>Footer Right</td>
> </tr>
> </table>
(snip)
> Thank you very much and Im looking forward to some good insight as I
> have looked at numerous sites and templates and still have issues.
>
nightstar,

It's late and I'm tired and I haven't tested this, but it may give you a
starting point:

<div>
<div style="float: left; width: 33%">
Header left
</div>
<div style="float: left; width: 33%">
Header center
</div>
<div style="float: left; width: 33%">
Header right
</div>
</div>
<div style="clear: all"> (or is it "both"? One of them is deprecated)
Section 1
</div>
<div style-"clear: all">
<div style="float: left; width: 66%">
Section 2
</div>
<div style="float: left; width: 33%">
Section 3
</div>
</div>
<div style="clear: all">
<div style="float: left; width: 33%">
Footer left
</div>
<div style="float: left; width: 33%">
Footer center
</div>
<div style="float: left; width: 33%">
Footer right
</div>
</div>

Of course I've made some assumptions about the content and what physical
relationships need to be preserved. A URL pointing to the current page
would be a help.

Chris Beall

• Next in forum: Re: how this works (redirection??)
• Prev in forum: Re: DIV and DIV on different lines
• Thread view: Re: Convert Table to CSS

[Reply to this message]