IE6 problemer med centrering!
Jeg har følgende en formular, som er styret primært af styles:<form action="processform.php" method="post" ONSUBMIT="return validateform()">
<table class="tblfrm">
<tr>
<th colspan="2">Send me an email:</th>
</tr>
<tr>
<td nowrap width="100px">Your name:</td>
<td><input type="text" name="name" onmouseover="msover_field(this)" onmouseout="msout_field(this)" onfocus="fieldfocus(this)" onblur="fieldblur(this)"></td>
</tr>
<tr>
<td nowrap>Your email:</td>
<td><input type="text" name="email" onmouseover="msover_field(this)" onmouseout="msout_field(this)" OnChange="validateEmail()" onfocus="fieldfocus(this)" onblur="fieldblur(this)"></td>
</tr>
<tr>
<td nowrap>Subject:</td>
<td><input type="text" name="subject" onmouseover="msover_field(this)" onmouseout="msout_field(this)" onfocus="fieldfocus(this)" onblur="fieldblur(this)"></td>
</tr>
<tr>
<td nowrap valign="top">Message:</td>
<td><textarea name="message" onMouseOver="msover_field(this)" onMouseOut="msout_field(this)" onFocus="fieldfocus(this)" onBlur="fieldblur(this)">Type your message here!</textarea></td>
</tr>
<tr>
<td colspan="2">
<input type="reset" name="reset" value="Delete Email" id="reset" onclick="ClearFields() ">
<input type="submit" name="submit" value="Send Email" id="submit">
</td>
</tr>
</table>
</form>
Jeg benytter følgende stylesheet til at styre det:
table.tblfrm {
margin-left : 20%;
margin-right : 20%;
width : 60%;
}
table.tblfrm th {
background : #003300;
border-bottom-color : #33CC33;
border-bottom-style : solid;
border-bottom-width : 1px;
border-top-color : #33CC33;
border-top-style : solid;
border-top-width : 1px;
font-weight : bold;
padding : 3px;
text-align : left;
white-space : nowrap;
}
table.tblfrm input {
width : 100%;
background-color : transparent;
border : none;
border : 1px solid #006600;
color : #33CC33;
}
table.tblfrm textarea {
width : 100%;
height: 100px;
background-color : transparent;
color : #33CC33;
border : 1px solid #006600;
overflow: auto;
/* kun > IE5.5 */
scrollbar-arrow-color: #33CC33;
scrollbar-3d-light-color: #FF33FF;
scrollbar-base-color: #003300;
scrollbar-face-color: #003300;
scrollbar-highlight-color: #33CC33;
scrollbar-darkshadow-color: #006600;
scrollbar-shadow-color: #33CC33;
}
#reset, #submit {
border:1px outset #33CC33;
color:#33CC33;
width:140px;
margin-top : 20px;
}
#reset {
background: #003300 url("../images/thmbnew.png") no-repeat 0% 50%;
float:left;
}
#submit {
background: #003300 url("../images/thmbmail.png") no-repeat 0% 50%;
float:right;
}
Mit problem er at i IE6 har den et problem med at centrere tabellen - det virker lidt tilfældigt hvornår den har lyst til at centrere og hvornår den aligner tabellen ude i venstresiden!
Hvis jeg resizer vinduet, hopper tabellen frem og tilbage mellem venstre kant og midten...
Det virker fint i NN6.2 og en tilsvarende formular som benytter de samme styles fungerer også fint!!!
Er der nogen som kan se, hvad problemet kan skyldes!?
Laver jeg slamkode - er der en nemmere vej - bryder jeg nogle gyldne css-love eller er IE6 bare dårlig...
Spørgsmålene hober sig op - følg med i næste afsnit, hvor vi forhåbentlig får nogle svar!
