标签: css-tables

我想要一个设置了百分比宽度的divwith 。是我最好的选择，我需要几个并排的高度相等。display: table-celldisplay: table-celldiv

经过研究，我正确地将父级设置为display: table; table-layout: fixed; width: 100%在许多其他线程中找到的那样，但table-cell仍然填充了父级。

.table-wrapper {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.table-cell {
  display: table-cell;
  width: 25%;
  overflow: hidden !important;
  border: 1px solid black;
}

<div class="table-wrapper">
  <div class="table-cell">
    Should be 25%, but it fills .table-wrapper
  </div>
</div>

这不可能吗？

我在这里完全不知所措。我想在 html 电子邮件的居中表格中嵌套多个表格，并且 firebug 和 W3C 验证器都告诉我，打开表格标签多于关闭表格标签。firebug 中的测试显示包含表与嵌套表之前一样，而不是围绕它们。

如果我将包含更改<table>为 a <div>，所有问题都会消失。不知道出了什么问题。

这是有问题的 html 电子邮件：http ://coastmusic.com/optiweb/

我想为我的桌子排做悬停阶段.如果将鼠标悬停在行上而不是背景颜色应该更改.

我的CSS是这样的:

.tabuler_data {border-collapse:collapse;}
.tabuler_data td {border:solid 1px #ccc;}
.tabuler_data tr:nth-child(even) td, tbody tr.even td {background:#fff;}
.tabuler_data tr:nth-child(odd) td, tbody tr.odd td {background:#f5f5f5;}
.tabuler_data thead {background:#666;font:bold 12px Arial, Helvetica, sans-serif;color:#fff;text-align:center;}
.tabuler_data th{border:solid 1px #ccc;}

我尝试将div类和风格组合在一起,但不知何故风格不起作用.我找不到答案..这是代码:

PHP

<div class="table">
<p><b>TEXT here</b><br />
...</p>
<div class="table_cell" style="width=180px !important; color=red !important;"><p>1<br />2<br />3<br />4<br />5<br />6</p></div>
<div class="table_cell" style="width=645px !important;"><p><b>&euro; 282</b><br /></p></div>
<p>Good luck in the future</p></div>

CSS

    div.table{
margin: 10px;
padding: 10px;
width: 825px;
border: 1px solid;
background: #E0F8EC;
border-radius:10px;
}

div.table_cell{
margin-top: 10px;
margin-bottom: 10px;
float: left;
}

div中定义的样式不起作用,除了来自外部css文件的样式.

我想在加载时隐藏一个表,并根据类名显示其子项之一.可以用CSS做到吗？

我试图这样做,但我认为它继承自display:none;

我知道我可以使用奇数和偶数来为表中的交替行着色.不过,我希望能够彩色每三排,所以着色是这样红-绿-蓝-红-绿-蓝.

此外,我想制作一般的并使用n种颜色来设置每个第n行的样式.

目前,我动态地生成表,并且对于每次迭代,我在每个td标记上输入类名modulo0,modulo1等.

有没有更好的办法？一个更自动化的,即.

JSFiddle of the offnding code:Fiddle

具体如下:

.start{
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}

我正在制定一份时间表.整个表格的背景背景颜色为.5 alpha,因此页面背景显示.在安排某些事情时,各个块以特定颜色突出显示.这些单元中的第一个和最后一个具有半径.

理想情况下,我希望能够在角落中保持.5 alpha背景,其中半径会留下一些白色.我尝试在tr元素上设置背景,但这并没有持久化(被类推翻).Div似乎是一个不错的选择,但我不想要单元格之间的边界(这里不是为了简单起见),而div在这种情况下似乎不允许这样做.

我试图在表中创建几行,但是使用div.

每个人都有一个左边的图像,一个文本块,以及"阅读更多"..

我尝试过使用display:table,但它似乎没有工作..文本和图像没有正确对齐..

http://jsfiddle.net/76a4j/1/

.entry{
width=100%;
display:table;
}

entry-row {
border: 2px #000000 solid;
margin-top:5px;
   margin-bottom:5px;
 display: table-row;
}

.imgrL {
border: 1px solid #c7c5c8;
padding: 5px;
float:left;
clear:left;
}

感谢大家的答案,我看到我做错了什么,现在修好了:)

我正在使用Dreamweaver,我想交替地为动态表的行着色.我似乎无法找到任何适合我或我理解的答案.你能给出一个关于如何做的示例CSS吗？解释会有所帮助,因为我对编码没有信心.

我正在使用Chrome浏览器.

我试图使表头固定并滚动正文，并使用了以下CSS。但这会破坏表的布局。（标题列的宽度与主体列的宽度不同）。如何避免这个问题？

#tblLocations thead, tbody {
    display: block;
}

#tblLocations tbody{   
   max-height: 290px;
   overflow-y:scroll;
}