Hi all,
I'm surprised I can't find the answer to this on the interweb; I haven't had to
do it for a while!
I have a list of about 10 items, all of varying heights (but fixed widths), in
a single <ul>. I want to clear every third list item and start a new row. Of
course, if they are different heights, the list items will float all over the
place - I'm sure we've all been through this!
I can add a class of "clear" to every third list item, which is great, but I'm
still having troubles in getting them to behave in IE. Has anyone got a
solution, or seen on online lately?!
Here is the code:
CSS
ul#imageLibraryList li {float:left; width:150px; display:inline; margin:0 20px
15px 0;}
ul#imageLibraryList li.clearLine {clear:both;}
HTML
<ul id="imageLibraryList">
<li class="clearLine">
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1297_148_148_75.jpg>"
alt="" />
<strong>Alder_140x30.jpg</strong><br/>
dfjdsflkjlk
</a>
</li>
<li>
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1291_148_148_75.jpg>"
alt="" />
<strong>Alder_140x30_BUMP.jpg</strong><br/>
</a>
</li>
<li class="clearLine">
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1152_148_148_75.jpg>"
alt="" />
<strong>Alder_190x30.jpg</strong><br/>
</a>
</li>
<li>
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1252_148_148_75.jpg>"
alt="" />
<strong>Alder_190x30_BUMP.jpg</strong><br/>
asdsdfdssf
</a>
</li>
<li class="clearLine">
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1202_148_148_75.jpg>"
alt="" />
<strong>Alder_240x30.jpg</strong><br/>
</a>
</li>
<li>
<a href="/">
<img
src="/<http://xpdev2.thegoodagency.co.uk/ahec/typo3temp/ahecimagelibrary/d_1181_148_148_75.jpg>"
alt="" />
<strong>Alder_240x30_BUMP.jpg</strong><br/>
</a>
</li>
</ul>
Please ignore invalid code, I can assure you it's not finished! Just want to
figure out a way to clear the line in all relevant browsers.
Cheers
Paul
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
