Question

我正在尝试在这种情况下制作一个3x3表格（使用CSS），保持角落固定大小，并使表格的其余部分根据内部的“单元格”拉伸。使用经典表格可能会花费我不超过10分钟，但因为我在过去遇到了桌面问题*咳嗽*咳嗽IE *咳嗽我决定尝试使用div-s和span-的CSS方式但由于某种原因它只是表现不对。

我可以提供一些提示吗？

Answer 1

我不确定我是否理解你的问题，但我认为你只是在寻找宽度为33％<div>的{{1}} s <br />每三个之后（或者你可以将每一行保留在它自己的包含div中）：

CSS：

  .col {
    float: left;
    width: 33%;
  }

  /* color columns for clarity */
  .odd {
    background-color: #999;
  }

  .even {
    background-color: #666;
  }

HTML：

<div class="col odd">1</div>
<div class="col even">2</div>
<div class="col odd">3</div>
<br style="clear: both;" />
<div class="col even">4</div>
<div class="col odd">5</div>
<div class="col even">6</div>
<br style="clear: both;" />
<div class="col odd">7</div>
<div class="col even">8</div>
<div class="col odd">9</div>

这就是你要找的东西吗？

带固定角落的3x3桌子

1 个答案: