我正在使用bootstrap 3,我试图给高度的表和行,但没有什么是为我工作.
我尝试设置line-height和其他属性的表,我如何可以增加高度？
<style>
div#description {
background-color: gray;
height: 25%;
border: 2px black;
}
tr {
line-height: 25px;
}
.container {
height: 100%
}
table {
height: 100%
}
#topics tr {
line-height: 14px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-7 col-xs-10 pull-left">
<p>Hello</p>
<div class="table-responsive">
<table class="table table-bordered ">
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col-md-5 col-xs-8 pull-right" id="description">
<p>Hello2</p>
</div>
</div>
</div>
解决方法
对于< tr>只是设置
tr {
line-height: 25px;
min-height: 25px;
height: 25px;
}
它也与引导一起工作.对于100％的高度,100％必须是100％的东西.因此,您必须为其中一个容器或身体定义固定的高度.我想你想要整个页面是100％,所以(示例)：
body {
height: 700px;
}
.table100,.row,.container,.table-responsive,.table-bordered {
height: 100%;
}
$('body').height(document.documentElement.clientHeight);
所有这些在这个小提琴 – > http://jsfiddle.net/LZuJt/
注意：我不在乎你在#description上有25％的高度,桌子上的高度是100％.猜猜这只是一个例子.并注意到clientHeight是不正确的,因为documentElement是一个iframe,但你会得到自己的projekt的图片:)
