我编写的 div 表控件无法在 IE 中正确显示。
我的“表格”只是一系列设计得像表格的 div,一切在 FF 和 Chrome 中看起来都很好,但似乎无法让我的“行”在 IE 中正确显示。
它似乎将所有行压缩到表格的左侧,然后将它们换行。我可以通过调整行 div 的宽度来调整它,但我想找到另一种解决方法,因为这是一个控件,并且知道要应用的正确宽度可能很困难。这是它正在执行的操作的屏幕截图。
我还注意到,当我在 22 英寸宽屏显示器上最大化屏幕时,它会正确排列所有内容。不确定那里发生了什么。
这也是我的 CSS,我认为标题已经足够解释了。
.dataTable
{
border-style: solid;
border-width: .5px;
border-color: #dae2c1;
border-collapse: collapse;
font-family: PTSansCaptionBold, Arial, Sans-Serif;
}
.Table div
{
font-size: 12px;
color: #888;
margin: 0;
float: left;
overflow: hidden;
}
.HeaderRow div
{
border: 1px solid #f3f5eb;
padding: 5px 3px;
background-color: #bcc3a7;
color: #FFFFFF;
opacity: 0.7;
text-transform: uppercase;
-moz-user-select: none;
user-select: none;
cursor: pointer;
position: relative;
}
.DataRow
{
clear: both;
}
.DataRow div
{
border: 1px solid #000000;
border-color: #e7ecd7;
padding: 5px 3px;
min-height: 12px;
}
这是一些 html
<div class="HeaderRow">
<div style="width: 100px; text-align: left;"><span id="arrow"></span>DRAWING #</div>
<div style="width: 100px; text-align: left;"><span id="arrow"></span>LOT #</div>
<div style="width: 100px; text-align: left;"><span id="arrow"></span>Serial #</div>
<div style="width: 100px; text-align: left;"><span id="arrow"></span>AS BUILT</div>
<div style="width: 100px; text-align: left;"><span id="arrow"></span>AS DESIGN</div>
<div style="width: 200px; text-align: left;"><span id="arrow"></span>DESCRIPTION</div>
</div>
<div class="DataRow">
<div style="width: 100px; text-align: left;">0102-10002</div>
<div style="width: 100px; text-align: left;"> </div>
<div style="width: 100px; text-align: left;">1004</div>
<div style="width: 100px; text-align: left;">94</div>
<div style="width: 100px; text-align: left;">9</div>
<div style="width: 200px; text-align: left;">HUT (HARD UPPER TORSO ASSY)</div>
</div>
最佳答案
您可以尝试显式地将每行的宽度设置为等于标题的宽度。
在 jQuery 中尝试一下:
var headerWidth = $('.HeaderRow').width();
然后将其设置为等于每行的宽度
$('.DataRow').css({width: headerWidth });
关于css - IE 中的 div 表格格式问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5870071/