我在这个页面上工作,其中包含一个modal-body内的表。
我工作的屏幕是22英寸,桌子看起来很完美。但是当我在笔记本电脑Macbook 13英寸上看到它时,桌子会延伸到屏幕的宽度。如何自动调整大小?
<div class="modal-body"
style="width: 1600px; margin: 0 auto; overflow: hidden;">
<loading></loading>
<span us-spinner="{radius:30, width:8, length: 16}"
spinner-key="spinner-1"></span>
<div class="panel-group" id="accordion">
<div class="panel panel-default"
data-ng-repeat="(spec,value) in audit | orderBy: 'specification' | groupBy: 'specification' ">
<div class="panel-heading">
<h4 class="panel-title">
<b> <a data-toggle="collapse" data-parent="#accordion"
href="#{{$index+1}}-{{value.id}}" target="_self"
style="color: black">{{spec}}</a>
<button class="btn btn-xs btn-link" ng-click="details(value)">
<i class="fa fa-info-circle" aria-hidden="true"></i>
</button>
</b>
</h4>
</div>
<div id="{{$index+1}}-{{value.id}}" class="panel-collapse collapse">
<div class="panel-body">
<table class="table" style="table-layout: fixed; width: 100%">
<thead>
<tr>
---------------
---------------
---------------
</tr>
</thead>
<tbody>
<tr data-ng-repeat="val in value track by $index">
----------------
----------------
----------------
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
答案 0 :(得分:2)
您可以使用max-width
代替width
来获得最大尺寸1600像素的光
对于较小的屏幕,它达到100%
PS:或者是否定义了最小宽度?关于其他桌子怎么样?是否真的需要表格布局属性?
答案 1 :(得分:1)
使用百分比在任何地方指定宽度