Menu
Menu

How to use DIVs instead of Tables (2 Column CSS)

Posted in Computers, Internet and World Wide Web on January 9, 2017
Tags: , , ,

If you're interested in using DIV tags instead of Tables, here's how you can easily make a two column setup that looks like tables but uses DIV tags instead. I went ahead and put some inline CSS instead of linking to an external stylesheet. First I'll show the code, then I'll show a live example of how it will look by adding some colors, and then In case my text gets all messed up, I will add a screenshot of my HTML and CSS that I used to make the two column table (DIV code with CSS).

Here's the code I'm using:

<div style="margin:auto;text-align:middle;width:100%;">
<div style="zoom:1;">
<div>
<div align="center" style="float:left;width:50%;">left column</div>
<div align="center" style="float:right;width:50%;">right column</div>
</div>
</div>
</div>

Below is an example, followed by a screenshot of the code:

left column div tag with css
right column div tag with css

 

DIV tags instead of tables

This is the code you can use to make a two column table using DIV tags instead of the Table, TR, TD tags.

One Response to “How to use DIVs instead of Tables (2 Column CSS)”

  1. If you need more columns you can visit this online code generator and hack through the HTML code and CSS by looking at their included stylesheet. http://developer.yahoo.com/yui/grids/builder/

Leave a Reply

Your email address will not be published. Required fields are marked *