HTML輸入與IE8

我'有問題，IE8和我的HTML/CSS =/HTML輸入與IE8

的代碼工作正常在Chrome，IE9，Mozilla和Safari瀏覽器嵌套IMG佈局錯誤。但在IE8它是醜陋：

enter image description here

我已經嘗試了很多東西，但沒有結果。它接縫要與填充一個問題...

HTML：

<div class="TituloDasTelas"> 
<span id="MainContent_LabelTituloTela">Test</span> 
<span style="font-size: x-large">|</span> 
<div class="buttons"> 

<input name="ctl00$MainContent$TextBoxFiltro" type="text" maxlength="100" id="MainContent_TextBoxFiltro" title="" class="TextBox300"> 

<input type="submit" name="ctl00$MainContent$ButtonPesquisar" value="Pesquisar" id="MainContent_ButtonPesquisar" class="regular"> 

<input type="button" id="PesqAvancada" value="" class="ButtonPesqAvancada" title=""> 

<img id="MainContent_ImagePesquisaAvancada" class="imgPesqAvancada" src="../../Include/Imagens/down.gif" alt="Pesq.Avançada"> 


<input type="submit" name="ctl00$MainContent$ButtonExportarParaExcel" value="Exportar" id="MainContent_ButtonExportarParaExcel" title="" class="positive"> 
</div> 
</div>

CSS：

.buttons 
{ 
    margin: 0 0 10px; 
    display: inline-block; 
} 
.buttons input[type=submit], .buttons input[type=button] 
{ 
    border-right: 1px solid #dedede; 
    border-bottom: 1px solid #dedede; 
    display: inline; 
    float: center; 
    background-color: #f5f5f5; 
    border-top: 1px solid #eee; 
    border-left: 1px solid #eee; 
    font-family: "Lucida Grande" , Tahoma, Arial, Verdana, sans-serif; 
    font-size: 12px; 
    line-height: 130%; 
    text-decoration: none; 
    font-weight: 700; 
    color: #565656; 
    cursor: pointer; 
    margin-left: 5px; 
    margin-right: 0; 
    margin-top: 10px; 
} 
.buttons input[type=submit], .buttons input[type=button] 
{ 
    width: 150px; 
    overflow: visible; 
    padding: 4px 10px 3px 7px; 
} 

.buttons button[type] 
{ 
    line-height: 17px; 
    padding: 5px 10px 5px 7px; 
} 
:first-child + html button[type] 
{ 
    padding: 4px 10px 3px 7px; 
} 
.buttons button img, .buttons a img 
{ 
    border: none; 
    width: 16px; 
    height: 16px; 
    margin: 0 3px -3px 0 !important; 
    padding: 0; 
} 
input[type=submit].positive, .buttons a.positive 
{ 
    color: #529214; 
} 
.buttons a.positive:hover, input[type=submit].positive:hover, .buttons input[type=button]:hover 
{ 
    background-color: #E6EFC2; 
    border: 1px solid #C6D880; 
    color: #529214; 
} 
.buttons a.positive:active 
{ 
    background-color: #529214; 
    border: 1px solid #529214; 
    color: #fff; 
} 
.buttons a.negative, input[type=submit].negative, .buttons input[type=button] 
{ 
    color: #d12f19; 
} 
.buttons a.negative:hover, input[type=submit].negative:hover, .buttons input[type=button]:hover 
{ 
    background: #fbe3e4; 
    border: 1px solid #fbc2c4; 
    color: #d12f19; 
} 
.buttons a.negative:active 
{ 
    background-color: #d12f19; 
    border: 1px solid #d12f19; 
    color: #fff; 
} 
input[type=submit].regular, .buttons a.regular, .buttons input[type=button] 
{ 
    color: #369; 
} 
input[type=submit]:hover, .buttons a:hover, .buttons a.regular:hover, input[type=submit].regular:hover, .buttons input[type=button]:hover 
{ 
    background-color: #dff4ff; 
    border: 1px solid #c2e1ef; 
    color: #369; 
} 
.buttons a:active, .buttons a.regular:active 
{ 
    background-color: #6299c5; 
    border: 1px solid #6299c5; 
    color: #fff; 
} 

.ButtonPesqAvancada, .buttons input[type=button] 
{ 
    width: 6px; 
    margin-left: -6px; 
    z-index: 2; 
} 

.imgPesqAvancada 
{ 
    cursor:pointer; 
    margin-left:-20px; 
    z-index: -1px; 
}

嚴重，我不知道是什麼問題。有什麼幫助嗎？

謝謝

來源

2012-06-05 Alan Araya

你能否在粘貼之前清理你的CSS？閱讀很困難。 –

您正在使用哪種doctype？ –

<！DOCTYPE HTML PUBLIC「 - // W3C // DTD HTML 4.01 Transitional // EN」「http://www.w3.org/TR/html4/loose.dtd」> as doctype –

好吧，我發現了問題。它與輸入的字體有關。我在輸入值中寫了「1」，並使其與背景的顏色相同。現在它在所有瀏覽器上都可以正常工作。

來源

2012-06-05 18:23:21

回答

相關問題