Last image won't line up

liunx

Guest
The "clear:both" is a last-ditch desperation move to get the last image to move up into line. No will do. The left image and the two selection boxes are in a row with the right-floated image offset below them and well to the right of the second selection box. The div is plenty wide enough, as that image is well to the right of the second selection box. There's no classes involved here, the class on the selection boxes is merely font specification.

The "display:block" is to get rid of the space under the image so that it will line up horizontally with the selection box. (And so that it will sit closely on top of the element below it in the final page when the time comes.)

<div style="width:190px;">
<a href=http://www.webdeveloper.com/forum/archive/index.php/"reset.php?Plus=1">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"minus.gif" style="display:block; float:left; margin-right:3px; border:0; clear:both;"></a>
<select name=Mth class="calsel" style="width:55px; clear:both;">
<option value=1>Jan</option>
<option value=12>Dec</option>
</select> <select name=Yr class="calsel" style="width:60px; clear:both;">
<option value=2002>2002</option>
<option value=2004>2004</option>
<option value=2005 selected>2005</option>
</select><a href=http://www.webdeveloper.com/forum/archive/index.php/"reset.php?Minus=1">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"minus.gif" style="display:block; float:right; margin-left:3px; border:0; clear:both;"></a>
</div>Both SELECT boxes and IMG's are inline elements, and as such you can adjust their vertical aligment in a line of text by using the vertical-align CSS property. Try setting both the IMG and SELECTs to vertical-align: bottom and get rid of the block displays and floats.You're the man. Boy was I ever over-complicating that situation.
Thank you.Any time :)
 
Back
Top