Jump to content

Change <table> into <div>

Recommended Posts

Going from a table-styled website to divs is not as simple as it sounds. div tags take a lot more CSS to match a desired look. It is especially difficult to get the bottom of columns to line up using div tags. I personally prefer div tags. Someone I know doesn't know the first thing to HTML prefers tables. Tables are more user friendly to rookies. Divs, although seemingly not as user-friendly, make for user-friendly code that is organized.

Link to post
Share on other sites
  • 3 weeks later...

Terryds. As Spunky has suggested, if you're unfamiliar with HTML then you may find it a little tricky at first. However, there are some great resources on the w3schools.com website which will tell you all you need to know. Try looking at this ... http://w3schools.com/html/html_layout.asp#gsc.tab=0 Once you understand the basics you'll then want to take a look at CSS (particularly CSS positioning) to get your desired look, which you can read about here ... http://www.w3schools.com/css/css_positioning.asp#gsc.tab=0 Of course, you have to know how to apply CSS in the first place. If you don't, I would suggest starting from the beginning of the CSS documentation on the w3schools website.

Link to post
Share on other sites
  • 1 year later...

www.HTML-Cleaner.com is a great website I always use to clean my HTML code and it can convert html tables into structured DIVs. Simply paste your code in the editor, check the allocated cleaning option and press the Clean button. Don't forget to include the provided css code to style the divs: http://www.html-cleaner.com/features/replace-html-table-tags-with-divs/

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...