Hi there, 3 days I was stuck with a css form that the value in the
<select> group overlapping the next element.
http://clients.lotusseeds.com/contactus.html
My workaround is this:
http://clients.lotusseeds.com/contactus1.html
adding a class with margin-bottom
.break1 {
margin-bottom: 220px;
line-height: 1.2px /* can't remember why I put this line-height
for */
}
so it looks like this:
<div class="row1">
<label for="##"><strong>text here</label>
<span class="col2">
<select name="##" id="###" >
<option value="##">more option1</option>
<option value="##">more option2</option>
</select>
</span>
</div>
<p class="break1"> </p> <!-- break insert here --!>
<div class="row1">
<label for="##"><strong>text here</label>
<span class="col2">
<select name="##" id="###" >
<option value="##">more option1</option>
<option value="##">more option2</option>
</select>
</span>
</div>
This method has worked well in Safari, Opera and Firefox, but in IE
it creates double margin.
I tried the Peekaboo and Line-height / Replaced Element hacks, none
of them seem to work. Worse, in my last attempt, all the input field
drops to second line (I can solve this one I believe but my brain
isn't working right now).
here is my css for the form.
http://clients.lotusseeds.com/contactform.css
Wonder if this is more a follow CSS spec route or a creative approach
way to make IE behave? I somehow feel that adding a margin-bottom
class is cheating.
by the way, if you read my previous post regarding the 'open new
window' dilemma, well ! my client yet to decide what she wants to do
with it.
Regards,
tee
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
