2010-11-22 16 views
1

habe gerade seltsames Problem in ie7 Rendering gefunden (kann für frühere Versionen anders sein). Wenn ich in td eingegeben habe, erstelle Zelle mit der Höhe mehr als andere Browser (ff, ie8, chrome). Alle Ränder werden zurückgesetzt, Padding entfernt, cellcpacing auf Nullen. Der einzige mögliche Weg, um sie gleichwertig zu machen , die ich gefunden habe, ist Höhe für alle tds in Pixeln angeben. Aber es scheint mir sehr hässlich.ie7 td mit Eingabe zusätzlichen vertikalen Abstand

hier ist html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
    <link type="text/css" href="styles/main.css" rel="Stylesheet" /> 
</head> 
<body> 
    <br /> 
    <table cellspacing="0" cellpadding="0" border="0" class="details-table"> 
     <tr class="details-row"> 
      <td> 
       <label for="txtFirstName">First Name</label> 
      </td> 
      <td> 
       <label for="txtFirstName">Last Name</label> 
      </td> 
     </tr> 
     <tr class="alt-details-row"> 
      <td> 
       <label for="txtFirstName">First Name2</label> 
       <input type="text" class="details-input textField" id="txtFirstName2" name="txtFirstName2" /> 
      </td> 
      <td> 
       <label for="txtLastName2">Last Name2</label> 
       <input type="text" class="details-input textField" id="txtLastName2" name="txtLastName2" /> 
      </td> 
     </tr> 
     <tr class="details-row"> 
      <td> 
       <label for="txtFirstName3">First Name3</label> 
       <input type="text" class="details-input textField" id="txtFirstName3" name="txtFirstName3" /> 
      </td> 
      <td> 
       <label for="txtLastName3">Last Name3</label> 
       <input type="text" class="details-input textField" id="txtLastName3" name="txtLastName3" /> 
      </td> 
     </tr> 
    </table> 
</body> 
</html> 

hier ist CSS:

html, 
body, 
form, 
table, 
tr, 
td 
{ 
    margin: 0; 
    padding:0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
} 


body 
{ 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px ; 
} 

input.textField 
{ 
    margin:0px; 
    padding:0px; 
    border: 1px solid #BFBFBF; 
    height: 17px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px ; 
} 

.details-table 
{ 
    width:100%; 
    color: #666 
} 

.details-table tr.details-row, 
.details-table tr.details-row td 
{ 
    background: #ebe4bc; 
} 

und hier ist Screenshot: alt text

Antwort

1

Das glaube ich nicht, dass Sie es durch Ändern der beheben Höhe von entweder td oder Eingang Element, wie es immer gibt s 1 Offset automatisch generiert für diesen Eingang im IE7-Modus. In IE8 oder anderen gängigen Browsern wird der zusätzliche 1-Offset nicht generiert.

Ich denke, es ist ein Fehler in IE7.

2

float: links auf die Elemente könnte helfen

Verwandte Themen