HTML DIV Table With Flexible Height/Width

hackeruk

New Member
Currently i have a HTML table which looks like:\[code\]---COLM1---|---COLM2---|---COLM3---data1 smalldatadata 2data 3NEW ROW 1 NEW ROW 2\[/code\]The new row 1 shows the new row for column one right underneath the longest content. But for row 2 i want it to dispaly right under small data.The code i currently have which works for this example but not for what i want is:\[code\]/**-- 3 Column Table Using DivsEach Column can be any length--**/ .divTable{width: 100%;}.divTableArticle{display: inline-block;vertical-align: top;width: 23%; }.divTableRow{clear: left;padding-top: 15px;margin-bottom: 10px;}\[/code\]And the html corresponds:\[code\]<div class="divTable"> <!--AS MANY ROWS--> <div class="divTableRow"> <!---AS MANY ARTICLES---> <div class="divTableArticle"></div> </div></div>\[/code\]How would i modify my code to match my new requirements?As im currently listing each rows data, would it be better to list each columns data?JS Fiddle: Click Here
 
Back
Top