3 column layout with css display table, with first row having multiple rows?
- by Damainman
I am working on a new website which:
Has 3 columns - Each Column being a cell
First column has 3 rows (Logo, Nav, icons) - Has a Div with display: table which wraps arround 3 divs with display:table-row.
Other two columns only have 1 row. With the middle column being the content area.
However since this is my first time using display:table, I am running into some things that aren't so clear to me. I was trying to avoid floating divs.
If I need multiple rows with one cell in each row per column, do I embed each cell in a row or just create each row and not declare cells. I understand that browsers automatically create the missing elements but I want to make sure I do this properly to avoid any side effects that might occur due to the browser automatically creating the missing elements.
Edit:
I think my brain is just over worked, I guess I can accomplish this by just using 3 divs in the first column instead of using a nested table div with the rows. This just popped into my head.
