I have a table and want the first columns to have a vertical scroll bar. This works in Chrome, IE9, Safari on iPad but not in Firefox? Why not? What am I doing wrong?
我有一个表,希望第一列有垂直滚动条。这在Chrome、IE9、iPad的Safari浏览器上都有效果,但在Firefox中却不行?为什么不呢?我做错了什么?
HTML:
HTML:
<table>
<tbody>
<tr>
<td class="col1">
<div class="wrapper">
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
...
</div>
</td>
<td class="col2">
</td>
</tr>
</tbody>
</table>
CSS:
CSS:
html, body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
table {
width: 100%;
height: 100%;
}
table .col1 {
width: 20%;
height: 100%;
}
table .col1>div.wrapper {
width: 100%;
height: 100%;
overflow: auto;
}
table .col2 {
width: 80%;
height: 100%;
background-color: red;
}
1 个解决方案
#1
5
The issue:
问题:
overflow:scroll;
won't work inside a table
.
溢出:滚动;不能在桌子里面工作。
If you do the same with a div
, then it will work fine.
如果您对div执行相同的操作,那么它将正常工作。
See Live Example
看到生活的例子
Example:
例子:
HTML
HTML
<div class="col1" >
<div class="wrapper">
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
...
</div>
</div><div class="col2">
</div>
More read: http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html#replies
更多阅读:http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html答道
Thanks to kirtan
由于kirtan
#1
5
The issue:
问题:
overflow:scroll;
won't work inside a table
.
溢出:滚动;不能在桌子里面工作。
If you do the same with a div
, then it will work fine.
如果您对div执行相同的操作,那么它将正常工作。
See Live Example
看到生活的例子
Example:
例子:
HTML
HTML
<div class="col1" >
<div class="wrapper">
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
<p>Test</p>
...
</div>
</div><div class="col2">
</div>
More read: http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html#replies
更多阅读:http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html答道
Thanks to kirtan
由于kirtan