html - Align div into a list element like a grid -
i have structure:
<ul class="wrap-accordionblk"> <li class="accordionblk-item"> <div class="accordionblk-header"> <div class="row-fluid"> <div class="infoblk"> <label>id sessione</label><strong>mm-00120853</strong> </div> <div class="infoblk"> <label>data</label>31/01/16</div> <div class="infoblk"> <label>nome sessione</label>ferrarif-2b0000118188</div> <div class="infoblk"> <label>anno stagione</label>ai 2015</div> <div class="infoblk"> <label>tipo ordine</label>2b</div> <div class="infoblk"> <label>n° capi</label>1</div> <div class="infoblk"> <label>valore </label>€ 94,92</div> <div class="infoblk"> </div> </div> </div> </li> <li class="accordionblk-item"> <div class="accordionblk-header"> <div class="row-fluid"> <div class="infoblk"> <label>id sessione</label><strong>mm-00120854</strong> </div> <div class="infoblk"> <label>data</label>29/01/16</div> <div class="infoblk"> <label>nome sessione</label>ferrarif-2b0000118030</div> <div class="infoblk"> <label>anno stagione</label>ai 2015</div> <div class="infoblk"> <label>tipo ordine</label>2b</div> <div class="infoblk"> <label>n° capi</label>1</div> <div class="infoblk"> <label>valore </label>€ 94,92</div> <div class="infoblk"> </div> </div> </div> </li> </ul>
i have problem that, if session name (nome sessione) have different number of characters, have grid column not aligned. can see result in jsfiddle here.
how can modify css make columns aligned each others if string have different number of characters?
adding width: 14.25%; class .infoblk fixes this. there reason don't want assign widths?
.infoblk{ width: 14.25%; }
Comments
Post a Comment