-3

I find using tables as the backbone easier to manipulate, specially when aligning things vertically. But I only seem to find code samples using DIV with heaps of CSS that looks like hacks into the inner workings of CSS.

Rafael Ventura
  • 284
  • 3
  • 13
  • 4
    short: DO NOT USE TABLE! – Pedram Apr 18 '16 at 05:38
  • never ever use the table. – Fiido93 Apr 18 '16 at 05:38
  • Sounds like you might like to checkout flexbox. Table layouts were always a hack. – Alexander O'Mara Apr 18 '16 at 05:39
  • But we can use table when either client request or when you are going to show tabular data with some condition. – Leo the lion Apr 18 '16 at 05:39
  • `
    ` structure is best `` is not that flexible..so use div
     – Gaurav Aggarwal Apr 18 '16 at 05:40
  • Using `
    ` is better one, as tables are heavy to load.
     – Priya Apr 18 '16 at 05:41
  • Agree w Rafael. I did heavy web full-stack 15 years ago when CSS was budding. Tables did everything before CSS. I program in many languages and i wanted to fall in love with CSS 100% and for the most part it's very cool but honestly when it comes to doing simple things like true dynamic alignment on the screen or within a parent item you can find dozens of solutions saying how "Easy" it is but only 1 or 2 of them actually work and the CSS is just plain foreign and require bloated header/trailing divs looking more like a work around than what everybody claimed tables were. – Tim Wiley Sep 17 '18 at 23:30

4 Answers4

2

Using <table> for layout is considered a hack.

Layouts used to be done with <table> a long time ago before CSS was around. Nowadays, it common practice to separate out the structure, styling, and behavior of your project into HTML, CSS, and JavaScript, respectively.

With HTML5, there has been a push for using semantic tags such as <article>, <section>, and so on in place of <div>. Nonetheless, <div> is still fine and 100% preferable over <table> unless you're specifically working with tabular data. Even then, the actual layout styling should still take place in your CSS.

timolawl
  • 5,434
  • 13
  • 29
1

current best practices is to use <div> instead of <table> for layout.

main reasons are:

  • <table> are inflexible, in the sense that a table layout is embedded in the html structure of the table element and his childs (ie <tr><td>)

  • <div> allows lots of freedom on layout with css regardless of their html structure

  • <table> layout can be easly achieved using with css

note that for tabular data the best practice is to use <table>

also note that semantic HTML5 elements like <header> <nav> <article> <section> <footer> are consider a better choice for markup than <div>

Giuseppe
  • 846
  • 5
  • 10
0

<table> is an HTML element that should be used to display formatted data, tabular data. We used it to make web layouts, but we tried to stop it 15 years ago.

Why ?

Because <table> is not designed to make website layouts, just to display and sort data (that's logically what a table would do). But CSS is. CSS can provide you many ways to think your layout: box model, flexbox, and some stuff like display: table that you should find useful.

Remember : HTML provides and structures data, CSS puts the style.

enguerranws
  • 8,087
  • 8
  • 49
  • 97
0

Back in days when there was no CSS3 and flexbox tables layouts was good because it' provided most of modern css functionality.

Modern programmers uses <div> and CSS3 and/or flexbox.

Currently when we have HTML5 even <div> is not so good solution as all elements in your page has some meaning. Now we have elements like <nav>, <section>, <aside> and much more

Don't use table for layout as it has different meaning than div, and you can achieve same (or maybe better) results with CSS

Justinas
  • 41,402
  • 5
  • 66
  • 96