Question

我正在使用Expression Web 4来编辑HTML（和IE9来显示它），当我有一些div，我尝试使用display：table和display：table-cell styles在表格中排列时，会出现这些项目垂直堆叠而不是水平堆叠。他们为什么不是并排？

以下是代码：

<html>
<head>
<style type="text/css">
.container {
  display: table;
}

.row {
  display: table-row;
}

.cell {
  display: table-cell;
  width: 100px;
  height: 100px;
  border: 1px solid blue;
  padding: 1em;
}
</style>
</head>
<body>
<div class="container">
  <div class="row">
    <div class="cell">CELL A</div>
    <div class="cell">CELL B</div>
    <div class="cell">CELL C</div>
  </div>
</div>
</body>
</html>

当我在IE9中打开它时，它会显示堆叠在彼此顶部的单元格，而不是并排放置（但它们在Chrome中看起来是正确的）。有什么想法吗？

即使使用表格单元格显示样式，项目也不会并排显示

0 个答案: