Tables VS DIV

[bluearrow]

This question is for those who still make static web pages and layouts like my self. Do you still make table based web pages or you use DIV tags ?

I'm a old schooler who is way too used to tables. But I'm trying to move to DIV tags.

[wink0r]

Div based design has significant accessibility advantages if you are using any sort of multi-column layout. Tables are properly used for tabular data. A single column site like a sales letter may not suffer, but those using screen readers or other alternative browsers can have problems making sense of multi-column table based layouts.

Div based layouts using proper semantic markup (h tags, p tags, and list tags) are likely to do better in the search engines, as well.

[bluearrow]

Search engines probably prefer cleaner and higher codes. You can get whole page done lighter with DIV tags then Tables. Also most of Web 2.0 sites are made with DIV. It also speed up the site loading time.

Couple of years ago I didn't want to move to DIV tags. But things have changed with time. DIV is the future of HTML I think.

[Nemanja]

Always choose DIV instead of table, it may be harder to design that but it is better in may ways guys already wrote in above posts.

[wink0r]

Once you learn the box model and css designing with divs is not so hard, especially since IE6 is falling out of the picture. The transition from designing with tables to designing with divs does have a learning curve, though.

My first pages used table based layouts. When I put them up in the 'show your site' section of the web editor forum I got complaints about the table based layout so I started learning about div based layouts. Now working with a table based layout requires more thought than building the site with divs.

[bluearrow]

Yeah Now I have grasp the theory so now I feel comfortable with it. HTML codes now looks clean and neat than with tables. Loads fast too. I still use table but less and less. There are still more to learn about these CSS layout design techniques.

[SocialArc]

Choose div instead of table, they are more clean and better.

[madhusmita]

Using tables in the designing is becoming outdated now.Tables are more space consuming.So, they take more time for loading.Loading time is very important for the web designing.So, DIV tag is becoming more popular now.It works better than the tables.

[bluearrow]

One problem have with DIV tag is centers problems.

[wink0r]

One problem have with DIV tag is centers problems.

I am not sure that I understand what problem you have, but layout should be handled with css. Inline style <div style="width: xxxpx; margin: o auto;">content</div> would do it, the key being to set the left and right margins to auto and having a width less than the viewport width specified. Inline styles are fine for one time situations but if it is a recurring situation you should make a css class rule and just apply the class to the div ( <div class="centered">content</div> ).

You have mentioned using php, so I would expect that you know your way around css coding.

[bluearrow]

When i want to align center one DIV element inside another DIV element I get this problem.

[wink0r]

You may need to give one a position relative rule, the outer one I think. position: relative; is the syntax as I recall. There is probably a float in there somewhere to add to the excitement?

[brothersadventures]

div base layout (Desing) is more flexible compare to table design. But i use most div structure in where data is deplays as form, i use table structure. to design quickly.

[Delois]

Div breaks the web page in similar parts. It can divide the section of the web page in few columns which shows the information side-by-side. It breaks the class in the CSS to end the class before its occurrence. In the DIV it is very easy to get the formation.

On the other hand table is using the rows and columns. In the table it is difficult to get the formation in the website. In the table the size is fixed as the percentage of the screen resolution.

[stronywwwlublin]

When i want to align center one DIV element inside another DIV element I get this problem.

try command:

margin 0 auto;

or just calculate all wanted distance rigidly in Your box model layout.

If You have trouble with heredity of div classes, just use separator div trick:

<div style="clear:both;"></div>

Another argument for div is maintaining web standards

[mapetshi]

Div is more better to use

[Phoenyx]

Div is more better to use

Why though? It would be great to know why you said that.

[webdesigneriqbal]

I use div all the way Table is inefficient. I even use div to display tabular data like menu.

[templates2011]

i also use div base. is easy to make static web pages

[onehandharry]

I remember when table based designs were the standard thing. That was horrible, too much nesting. Love div's though! That and HTML5 has really made things so much easier to make a static site/template