Frågan 23 aug. 2006 14:05 #1 <table width="526" border="0" cellspacing="0" cellpadding="0">
<form method="post" name="registrera" action="?action=SKICKA" onSubmit="return submitForm()">
<tr>
<td style="width:270px;"><input name="namn" type="text" class="inputField255" id="namn" tabindex="1"></td>
<td><input name="telefon" type="text" class="inputField255" id="telefon" tabindex="6"></td>
</tr>
<tr>
<td colspan="2" style="height: 18px;"><img src="bilder/spacer.gif" alt="" width="1" height="1"></td>
</tr>
<tr>
<td style="width:270px;"><input name="personnummer" tabindex="2" type="text" class="inputField255" id="personnummer" onkeyup="tabPersnr();"></td>
<td><input name="mobiltelefon" type="text" class="inputField255" id="mobiltelefon" tabindex="7"></td>
</tr>
<tr>
<td colspan="2" style="height: 17px;"><img src="bilder/spacer.gif" alt="" width="1" height="1"></td>
</tr>
<tr>
<td style="width:270px;"><input name="gatuadress" tabindex="3" type="text" class="inputField255" id="gatuadress"></td>
<td><input name="epost" type="text" class="inputField255" id="epost" tabindex="8"></td>
</tr>
<tr>
<td style="width:269px; height: 18px;"><img src="bilder/spacer.gif" alt="" width="1" height="1"></td>
<td rowspan="2" align="right" valign="bottom"><div id="kryssruta"><img src="bilder/spacer.gif" alt=" " width="16" height="15" onClick="if(document.getElementById('villkor').value=='1'){this.src='bilder/spacer.gif'; document.getElementById('villkor').value='0'} else {this.src='bilder/kryss.gif'; document.getElementById('villkor').value='1'}"></div>
<div id="villkortext"> </div><div id="knappContainer"><input type="image" name="imageField" src="bilder/skicka.gif" tabindex="9"></div></td>
</tr>
<tr>
<td style="width:269px;">
<input name="postnummer" type="text" class="inputField85" id="postnummer" tabindex="4">
<input name="postort" type="text" class="inputField163" id="postort" tabindex="5">
</td>
</tr>
<input type="hidden" id="villkor" name="villkor" value="0">
</form>
</table>
Varför skiljer sig höjden?
J jarvklo Medlem sedan juli 2001 3 378 inlägg Hmm.... §e
Felahanteringen i webbläsarna reagerar lite olika när det gäller just den där felaktiga kodkombinationen... §e
Hursomhelst En <form> får inte ligga "mellan raderna" sådär i en tabell, så där kanske du har en första orsak ;)...
Utöver det - Vad kör du med för <!DOCTYPE ? (höjdfördelning mellan tabellrader hanteras lite olika i Standards mode och Quirks mode)
Har du någon CSS kopplad till sidan som kan tänkas påverka t.ex. typsnittsstorlekar?
... finns säkert fler frågor... Har du möjlighet att lägga upp *hela* koden (eller länka till den) ?
Fixat!
Gjorde om det utan tabeller
Troxy Medlem sedan mars 2004 1 505 inlägg Posta gärna din färdiga kod, om du vill :)
<div id="container">
<form method="post" name="registrera" action="?action=SKICKA" onSubmit="return submitForm()" id="formContainer">
<input name="namn" type="text" id="namn" tabindex="1">
<input name="telefon" type="text" id="telefon" tabindex="6">
<input name="personnummer" tabindex="2" type="text" id="personnummer" onkeyup="tabPersnr();">
<input name="mobiltelefon" type="text" id="mobiltelefon" tabindex="7">
<input name="gatuadress" tabindex="3" type="text" id="gatuadress">
<input name="epost" type="text" id="epost" tabindex="8">
<input name="postnummer" type="text" id="postnummer" tabindex="4">
<input name="postort" type="text" id="postort" tabindex="5">
<div id="kryssruta" onClick="if(document.getElementById('villkor').value=='1'){document.getElementById('kryssbild').src='bilder/spacer.gif'; document.getElementById('villkor').value='0'} else {document.getElementById('kryssbild').src='bilder/kryss.gif'; document.getElementById('villkor').value='1'}"><img src="bilder/spacer.gif" alt=" " style="width:16px; height: 15px;" id="kryssbild"></div>
<div id="villkortext" onClick="modalDialogShow('avtal.html',600,570);"></div>
<input type="image" name="imageField" src="bilder/skicka.gif" tabindex="9" id="knapp">
<input type="hidden" id="villkor" name="villkor" value="0">
</form>
</div>
css
/* CSS Document */
body{
margin: 0px; /* hälften av höjden */
}
#container {
background-image:url(bilder/bak.jpg);
background-repeat:no-repeat;
width:586px;
height: 552px;
left: 50%;
margin-left: -293px; /* hälften av bredden för centrering*/
margin-top: 40px;
position: absolute;
}
#formContainer {
width:525px;
height: 200px;
padding-left: 31px;
padding-top: 379px;
}
#tack {
background-image:url(bilder/tack.jpg);
background-repeat:no-repeat;
width:586px;
height: 552px;
left: 50%;
margin-left: -293px; /* hälften av bredden för centrering*/
margin-top: 40px;
position: absolute;
}
#formContainer input{
background-color: #000000;
border: 1px solid #333333;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#999999;
}
form #namn{
height: 16px;
width: 255px;
float: left;
}
form #telefon{
height: 16px;
width: 255px;
float: right;
}
form #personnummer{
clear: both;
height: 16px;
width: 255px;
float: left;
margin-top: 18px;
}
form #mobiltelefon{
height: 16px;
width: 255px;
float: right;
margin-top: 18px;
}
form #gatuadress{
clear: both;
height: 16px;
width: 255px;
float: left;
margin-top: 18px;
}
form #epost{
height: 16px;
width: 255px;
float: right;
margin-top: 18px;
}
form #postnummer{
clear: both;
height: 16px;
width: 85px;
float: left;
margin-top: 18px;
}
form #postort{
height: 16px;
width: 163px;
float: left;
margin-top: 18px;
margin-left: 5px;
margin-right: 11px;
}
#knapp{
float: right;
margin-top: 10px;
border:0;
}
#villkortext{
margin-top: 18px;
float: left;
width: 102px;
height: 20px;
cursor: pointer;
}
#kryssruta{
margin-top: 18px;
float: left;
width: 18px;
height: 17px;
cursor: pointer;
padding-top: 3px;
padding-left: 2px;
margin-right: 4px;
}
td{ line-height: 0; }