de layout in IE is weer eens anders dan in Firefox. Ik wil checkboxes onder elkaar met een bepaalde ruimte ertussen. Bij IE is die ruimte altijd groter, wat ik ook probeer. Iemand een idee hoe dit moet? de checkboxes staan in een 'list'.

<ul>
<li><input type="checkbox" style="margin:0px" /></li>
<li><input type="checkbox" style="margin:0px" /></li>
<li><input type="checkbox" style="margin:0px" /></li>
</ul>
margin:0;padding:0; werkt niet?
Je moet ook ff margin en padding voor <li> opgeven.
dit heb ik nu:

<tr><td height="0" style="line-height:0px"><ul class="main">
<li style="list-style:none; margin:0px">
<input name="checkbox_<?php echo $row_checkboxes['bestelnummer']; ?>" type="checkbox" onclick="telcheck()" style="margin:0px;" title="klik op het bovenste selectvakje om alles te selecteren of deselecteren"/>
</li>
</ul></td></tr>

bij firefox zit alles tegen elkaar aan, bij IE zit er ruimte tussen.
bij li heb je ook geen padding toch ?
en bij de td ook niet.. stel daar allebei eens een padding: 0px in en een margin: 0px, die je bij de li wel hebt
@ Steven: je kunt trouwens beter met embedded of gelinkte CSS werken. Inline CSS is veel onoverzichtelijker. Als je in jouw voorbeeld alle CSS er uit zou halen, en dit bovenin zou zetten:

<style>
ul {
list-style-type: none;
}
li, input {
margin: 0;
padding: 0;
}
</style>

Dat werkt veel lekkerder.
@jan

met jouw kan ik praten ^^
ja, klopt, maar dt doe ik altijd later pas, ik ben zoveel aan het testen dat ik niet de hele tijd omhoog wil scrollen.
maar dat padding en margin werkt niet bij IE?
blijft ruimte tussen die checkboxes zitten
Hmm, even een paardenmiddel:

Doe eens dit bovenin:

<style>

* {
padding: 0px;
margin: 0px;
}

</style>
geen verschil? dit heb ik nu:

<style>
* {
padding: 0px;
margin: 0px;
}
ul.main {
margin: 0;
padding: 0;
list-style: none;
width: 100%;
position: relative;
}
li, input {
margin: 0;
padding: 0;
}
</style>




<tr><td height="0" style="line-height:0px; padding:0px"><ul class="main">
<li>
<input name="checkbox_<?php echo $row_checkboxes['bestelnummer']; ?>" type="checkbox" onclick="telcheck()" style="margin:0px;" title="klik op het bovenste selectvakje om alles te selecteren of deselecteren"/>
</li>
</ul></td></tr>

het probleem zit bij IE, want firefox plakt de checkboxes gewoon aan elkaar.
het heeft ook te maken met line-height, want als ik dat weg haal word de ruimte groter bij firefox
En als je de line-height van li eens op 0 zet?

<style>
* {
padding: 0px;
margin: 0px;
}
ul.main {
margin: 0;
padding: 0;
list-style: none;
width: 100%;
position: relative;
}
li, input {
margin: 0;
padding: 0;
line-height: 0px;
}
</style>

Reageren