html table overflow,Replace HTML Table with Divs

Replace HTML Table with Divs

https://stackoverflow.com/questions/702181/replace-html-table-with-divs

55

19

Alright, I'm trying to buy into the idea that html tables should not be used, and that divs should be. However, I often have code that resembles the following

First Name:
Last Name:
Address:	NYCA	USACAN

I want the labels to be aligned and I want the controls to be aligned. How would I do this without using tables?

html css html-table

sharefollow

edited Sep 23 '16 at 20:50

Brian Tompsett - 汤莱恩

4,7741414 gold badges4242 silver badges113113 bronze badges

asked Mar 31 '09 at 17:39

Jacob Adams

3,90633 gold badges2020 silver badges4141 bronze badges

1

Here's a good read: Prettier Accessible Forms. – Chad Birch Mar 31 '09 at 17:41

25

The way you write the recommended best practice is NOT correct. The rule reads "You should not use tables FOR LAYOUT". It does not mean never to use tables. – bortzmeyer Apr 2 '09 at 9:04

I must be having a brain fart...isn't a table a layout structure? What else can you use it for? – xr280xr Jun 22 '12 at 18:21

4

@xr280xr for organizing tabular data...? – wrongusername Jul 17 '12 at 6:44

1

@wrongusername Visually organizing tabular data right? I.E. controlling the positioning of the data so it's arranged in a tabular format. That's layout. I'm assuming "FOR LAYOUT" must mean the layout of an entire page. – xr280xr Jul 19 '12 at 18:31

show 3 more comments

6 Answers

ActiveOldestVotes

43

This ought to do the trick.

First field