[thelist] Expanding n Divs to fit Div
Justin Stach
j.m.stach at canterbury.ac.uk
Wed Mar 17 05:40:52 CST 2004
Hello,
This problem's been causing me to scratch my head for a while, mainly
because it should be a total doddle, but for the life of me I can't
work it out.
Anyway: I have 1 to many div elements (in the example below with the
class 'indice') which I want to stack from left to right, expanding to
fit a containing div (id holder) with a known size. I don't know in
advance how many of the contained divs I'm going to have, as the page
will be built dynamically, but what I want is for the width of the div
to be equal to holder/numberOfIndices - much like what would happen if
I used a table (included in the example below for reference).
Yes, I could work out the width programatically and apply the width
that way, but that seems a disgustingly kludgey way to resolve the
problem. Hopefully I'm missing something blindingly obvious...
Ta in advance,
Justin
#holder {
width: 100%;
border: 1px solid green;
clear: both;
margin-bottom: 33px;
}
.indice {
float: left;
border: 1px solid red;
text-align: center;
}
<div id="holder">
<div class="indice">A</div>
<div class="indice">B</div>
<div class="indice">C</div>
<div class="indice">D</div>
<div class="indice">E</div>
<div class="indice">F</div>
<div class="indice">G</div>
</div>
<table id="holder" width="100%">
<tr>
<td class="indice">A</td>
<td class="indice">B</td>
<td class="indice">C</td>
<td class="indice">D</td>
<td class="indice">E</td>
<td class="indice">F</td>
<td class="indice">G</td>
</tr>
</table>
More information about the thelist
mailing list