Question

嘿伙计我有问题。我试图建立一个3列的网站，看起来像传单。

它在firefox中看起来很好，但在Internet Explorer（7是我的电脑上的版本）中，中间列宽的宽度被忽略。

这是代码，

</html>

<head>

<link rel="stylesheet" type="text/css" href="standards.css">

</head>

<body>
</div>
<div id="main">

<div id="row">

<div id ="column" style="float:left;">

</div>

<div id ="column" style="float:right;">

</div>

<div id ="column" style="margin: 0% 0% 0% 35%;">

</div>

<div id="row">

<div id ="column" style="float:left;">

</div>

<div id ="column" style="float:right;">

</div>

<div id ="column" style="margin: 0% 0% 0% 35%;">

</div>


</div>


</div>

</body>

</html>

和css，

div#column {
border-style:solid;
border-width:5px;

float: top;
text-align: justify;

padding: 2em;
min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */
height:97%;
width:25%;
background-color: #ffefd5;

}

div#row {
border-style:solid;
border-width:5px;
margin: 5% 5% 5% 5%;

text-align: justify;

padding: 2em;
min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */
height:200em;
background-color: #ffefd5;

}

div#main {
float: top;
text-align: justify;

padding: 2em;
min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */


}

Answer 1

如果div#main是您的中间列，则样式中没有设置width。只有min-width。 IE7与min-width有问题。见http://reference.sitepoint.com/css/min-width

修改

在看到更多代码时，我认为问题出在width和margin列div上。 width为25％x 3加margin 35％，超过100％。

此外，您有三列全部具有相同的ID。 ID用于单实例使用。如果您打算在多个元素上使用相同的样式，则需要使用class。将CSS中的#column更改为.column，将HTML中的class="column"更改为{{1}}。

Internet Explorer忽略了div的宽度

1 个答案: