html - 3 x 3 grid relative to viewport size in CSS -


i trying create 3 x 3 grid with each taking height , width values of 30% (i avoid vh, vw , vm units):

section { display:inline-block; padding: 0.5% 0.5%; margin: 0.5% 0.5%; box-sizing:border-box; width: 30%; height: 30%; border: #000 solid 1px;  } 

however, whilst width 30% height fix @ value, when first section has more text in second, ends taller.

see here: http://jsfiddle.net/gzcpw/

i'm pretty sure browsers don't accept height in precentage values. use javascript dynamically update absolute height value.

see here: use vertical percentage css - height: x%;


Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

CSS3 Transition to highlight new elements created in JQuery -