Convert HTML table Into DIv

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
shafiq2626
Forum Commoner
Posts: 88
Joined: Wed Mar 04, 2009 1:54 am
Location: Lahore
Contact:

Convert HTML table Into DIv

Post by shafiq2626 »

Helo every one!
Presently my webpage is using <table> tags and CSS to have a which is rendering flawlessly but I want to convert this table layout into div one but can't figure out how to convert such a table tags in div tags?
Please help me ASAP.
Thanks
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: Convert HTML table Into DIv

Post by kaszu »

Instead of table:

Code: Select all

<table width="100%"><tr>
    <td width="50%"></td>
    <td width="50%"></td>
</tr></table>
columns with divs:

Code: Select all

<div class="container">
    <div class="left"></div>
    <div class="right"></div>
</div>

Code: Select all

.container { width: 100%; overflow: hidden; } /* clear floats */
.left, .right { width: 50%; float: left; } /* Both columns have specified width and are floated */
* html .left { width: 49.9%; } /* Fix for IE 6 */
*:first-child+html .left { width: 49.9%; } /* Fix for IE 7 */
 
Fix for IE is needed, because of sub-pixel problems.
Post Reply