2012-06-05 48 views
0

我'有问题,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; 
} 

严重,我不知道是什么问题。 有什么帮助吗?

谢谢

+0

你能否在粘贴之前清理你的CSS?阅读很困难。 –

+0

您正在使用哪种doctype? –

+0

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

回答

0

好吧,我发现了问题。 它与输入的字体有关。 我在输入值中写了“1”,并使其与背景的颜色相同。现在它在所有浏览器上都可以正常工作。