个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
25
4
如何让 container div 在 Firefox 中显示垂直滚动条(它在 Chrome 中有效，我不关心 IE*)？通过“制作”，我的意思是让它在不使用 JS 的情况下工作。
<html>
<head>
<title></title>
<style type="text/css">
.full-size { width: 100%; height: 100%; }
.full-height { height: 100%; }
.table { display: table; }
.table-row { display: table-row; }
.table-cell { display: table-cell; }
.thin-border { border: 1px solid gray; }
.border-box { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.small-box { width: 50px; height: 50px; }
</style>
</head>
<body>
<div style="width: 400px; height: 200px; margin: 10px; border: 1px solid #ccc;">
<div class="full-size table">
<div class="table-row" style="height: 45px;">
<div class="table-cell">
<p>Test</p>
</div>
</div>
<div class="table-row full-height">
<div class="table-cell full-height" style="overflow: hidden;">
<div class="full-height" id="container" style="overflow-y: scroll;">
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
最佳答案
<body>
<div style="width: 400px; height: 200px; margin: 10px; border: 1px solid #ccc; ">
<div class="table-row" style="height: 45px;">
<div class="table-cell">
<p>Test</p>
</div>
</div>
<div class="full-size table">
<div class="table-row full-height"style="height:200px; overflow-y:scroll;>
<div class="table-cell full-height" >
<div class="full-height" id="container" >
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
<div class="small-box">A</div>
</div>
</div>
</div>
</div>
</div>
</body>
更新了! :
基本上你只是在错误的地方溢出了!
请记住，父级可以 overflow hidden - 然后子级可以有额外的滚动，这样您就可以更好地控制每个 div 的溢出。
引用:http://www.w3schools.com/cssref/pr_pos_overflow.asp
巧合的是这也将 IE.. :)
关于html - 放置在 100% 高度容器内时，Overflown DIV 不显示垂直滚动条，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17347161/
25
4
0
我正在尝试解决一个问题: Given a 32-bit signed integer, reverse digits of an integer, returns 0 when the reverse
这个问题在这里已经有了答案: Why is a flex item limited to parent size? (2 个答案) 关闭 3 年前。
下面是我的 HTML 和 CSS。我想使用 javascript 来确定其中一个 LI 何时溢出。然后我想将该元素放入弹出菜单中，类似于 Win32 工具栏。我需要知道 LI 何时溢出以及哪些 LI
如何让 container div 在 Firefox 中显示垂直滚动条(它在 Chrome 中有效，我不关心 IE*)？通过“制作”，我的意思是让它在不使用 JS 的情况下工作。 Fiddle
我是一名优秀的程序员,十分优秀！