更改列宽引导表 [英] Change column width bootstrap tables

问题描述

我有一个静态PHP站点，我正在使用Bootstrap。这些表由Bootstrap控制。

I have a static PHP site I'm using Bootstrap on. The tables are controlled by Bootstrap.

我注意到我似乎无法控制 TD 部分，以便我可以防止电话号码等，包装。你可以看到最后有足够的空间，只是不知道如何传播这个空间。

I've noticed that I have seemingly no control over the lengths of the TD sections so that I can prevent the phone numbers, etc..., from wrapping. As you can see there is plenty of space on the end, just don't know how to spread that space out.

我在< th> 上尝试了内联宽度但没有任何反应：

I tried inline widths on the <th> but nothing happens:

  <table class="table table-condensed table-striped  table-hover">
  <thead>
    <tr>
        <th>#</th>
        <th width="12%">Last Name</th>
        <th width="12%">First Name</th>
        <th width="12%">Spouse's Name</th>
        <th width="20%">Address</th>
        <th width="5%">City</th>
        <th  width="12%"class="did_phone">Phone</th>
        <th width="15%">E-Mail</th>
         <th width="15%"></th>
    </tr>
  </thead>
  <tbody>

那么......如何更改< td> 宽度，在Bootstrap中进行调整以便没有包装？

So... how does one change the <td> widths, make adjustments so there is no wrapping, in Bootstrap?

推荐答案

Bootstrap使表格 100％。所以Tables th 设置为 100％。解决方案是使其 auto 。所以我只是通过在我的css中添加以下内容来覆盖Bootstrap：

Bootstrap makes tables 100%. So Tables th is set to 100%. The solution is to make it auto. So I simply overrode Bootstrap by adding the following to my css:

table th {
    width: auto !important;
}

所有内容都完美排列。

这篇关于更改列宽引导表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！