set width of div relative to another div text like table td - css

Question

Check the first image.
I have set the div just displays in images.
![enter image description here][1]
[1]: http://i.stack.imgur.com/2ZVbu.png
the html is :
<div id="div_pro_qty_condi_168">
<label>Loyalty Cards :</label>
<input type="text" name="pro_qty_condi[168]" class="text_box_medium">
</div>
<div id="div_pro_qty_condi_1">
<label>Premium Business Cards :</label>
<input type="text" name="pro_qty_condi[1]" class="text_box_medium">
</div>
.
.
.
.
<div id="div_pro_qty_condi_135">
<label>Fearless Drawstring Bag :</label>
<input type="text" name="pro_qty_condi[135]" class="text_box_medium">
</div>
How can I set label to maximum size related to other biggest div like if I use table instead of div it auto set the <td> width as label text, but how can I set it with div?

Answer 1

Try this code:
Fiddle
label{
display:inline-block;
width:35%;
}

Answer 2

There maybe better ways but off the top of my head you could do sometime like this.
HTML:
<div>
<div id="div_pro_qty_condi_168">
<div>
<label>Loyalty Cards :</label>
</div>
<input type="text" name="pro_qty_condi[168]" class="text_box_medium" />
</div>
<div id="div_pro_qty_condi_1">
<div>
<label>Premium Business Cards :</label>
</div>
<input type="text" name="pro_qty_condi[1]" class="text_box_medium" />
</div>
<div id="div_pro_qty_condi_135">
<div>
<label>Fearless Drawstring Bag :</label>
</div>
<input type="text" name="pro_qty_condi[135]" class="text_box_medium" />
</div>
</div>
CSS:
div {
display: table;
}
div div {
display: table-row;
}
div div div {
display: table-cell;
}
DEMO HERE

Answer 3

Try this code:
$(function(){
var _nLen = $('label').length;
var _nMax = $("label:eq(0)").width();
for(var i=0; i<_nLen;i++) {
var _nTemp=0;
_nTemp = $("label:eq("+i+")").width();
if(_nTemp>=_nMax) {
_nMax = _nTemp;
}
}
for(var i=0; i<_nLen;i++) {
$("label:eq("+i+")").css('display','inline-block');
$("label:eq("+i+")").css('width',(_nMax+'px'));
}
});