当窗口缩小且水平轴出现在面板主体下方时,如何使面板标题的边框底部显示全宽?边框在窗口最大化时正常显示,但在窗口缩小时只显示与窗口相同的宽度。 这是代码:
<section class="panel">
<header class="panel-heading" style="display:block;"></header>
<div class="panel-body">
<table class="table table-hover table-bordered"></table>
</div>
</section>
.panel-heading {
padding: 10px 20px;
color: #535351;
font-size: 14px;
font-weight: bold;
min-height: 52px;
border-bottom: 1px solid #e5e5e5;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.panel-body {
padding: 15px 20px 15px 20px;
border-bottom: 1px solid #e5e5e5;
display: inline-block;
}
.table {
width: 100%;
margin-bottom: 20px;
min-width: 1130px;
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0;
display: table;
}
谢谢,
最佳答案
<section class="panel">
<header class="panel-heading" style="display:block;"></header>
</section>
<section class="panel">
<div class="panel-body">
<table class="table table-hover table-bordered"></table>
</div>
</section>
这段代码解决了我的问题。只需将标题分成一个新部分即可。
关于html - 面板标题中的边框底部在窗口缩小时不显示全宽,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30230625/