我的目标是创建一个具有 overflow x
和 overflow y
以及 auto
的容器,因为我将在那里渲染的内容(大表) 客户端应该会看到一个包含可滚动内容的“窗口”+ 如果该容器与 bootstrap 4 col
和 row
一起工作,那就更好了。我不想硬编码高度和宽度。
我认为代码应该可以工作,但它没有
.overflow-table {
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
}
.overflow-table .row {
display: block;
}
<div class="overflow-table">
<div id="dvData"></div>
</div>
<!-- to dvData I render at code behind table-->
<div class="overflow-table">
<div id="dvData">
<table class="overflow-table"> <!-- I try too something like this-->
</div>
</div>
谢谢!!
最佳答案
在表格周围的 div
上设置一个 max-width
和 max-height
。使用 vw
和 vh
单位或百分比以避免硬编码宽度和高度。
.window-overflow {
overflow-x: auto;
overflow-y: auto;
max-height: 95vh;
max-width: 100%;
}
关于css - 带有 bootstrap 4 的溢出容器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53838829/