本文翻译自:How to set up fixed width for
?
Simple scheme:简单方案:
<tr class="something"><td>A</td><td>B</td><td>C</td><td>D</td></tr>
I need to set up a fixed width for<td>
.我需要为<td>
设置固定宽度。I've tried:我试过了:
tr.something {td {width: 90px;}}
Also也
td.something {width: 90px;}
for对于
<td class="something">B</td>
And even乃至
<td style="width: 90px;">B</td>
But the width of<td>
is still the same.但是<td>
的宽度仍然相同。
#1楼
参考:/question/11Q7A/如何设置固定宽度-td
#2楼
Hard to judge without the context of the page html or the rest of your CSS.没有页面html或CSS其余部分的上下文很难判断。There might be a zillion reasons why your CSS rule is not affecting the td element.CSS规则不影响td元素的原因可能不胜枚举。
Have you tried more specific CSS selectors such as您是否尝试过更具体的CSS选择器,例如
tr.somethingontrlevel td.something {width: 90px;}
This to avoid your CSS being overridden by a more specific rule from the bootstrap css.这样可以避免引导CSS中更具体的规则覆盖CSS。
(by the way, in your inline css sample with the style attribute, you misspelled width - that could explain why that try failed!)(顺便说一句,在具有style属性的内联css示例中,宽度拼写错误-这可以解释为什么尝试失败的原因!)
#3楼
Ok, I just figured out where was the problem - in Bootstrap is set up as a default valuewidth
forselect
element, thus, the solution is:好的,我刚发现问题出在哪里-在Bootstrap中将select
元素设置为默认值width
,因此解决方案是:
tr. something {td {select {width: 90px;}}}
Anything else doesn't work me.还有什么对我没有帮助。
#4楼
If you're using<table class="table">
on your table, Bootstrap's table class adds a width of 100% to the table.如果您在<table class="table">
使用<table class="table">
,则Bootstrap的表类将为表添加100%的宽度。You need to change the width to auto.您需要将宽度更改为自动。
Also, if the first row of your table is a header row, you might need to add the width to th rather than td.另外,如果表的第一行是标题行,则可能需要将宽度添加到th而不是td。
#5楼
For Bootstrap 4.0:对于Bootstrap 4.0:
In Bootstrap 4.0.0 you cannot use thecol-*
classes reliably (works in Firefox, but not in Chrome).在Bootstrap 4.0.0中,您不能可靠地使用col-*
类(在Firefox中有效,但在Chrome中不可用)。You need to use OhadR's answer :您需要使用OhadR的答案 :
<tr><th style="width: 16.66%">Col 1</th><th style="width: 25%">Col 2</th><th style="width: 50%">Col 4</th><th style="width: 8.33%">Col 5</th></tr>
For Bootstrap 3.0:对于Bootstrap 3.0:
With twitter bootstrap 3 use:class="col-md-*"
where * is a number of columns of width.使用twitter bootstrap 3时,请使用:class="col-md-*"
其中*是宽度的列数。
<tr class="something"><td class="col-md-2">A</td><td class="col-md-3">B</td><td class="col-md-6">C</td><td class="col-md-1">D</td></tr>
For Bootstrap 2.0:对于Bootstrap 2.0:
With twitter bootstrap 2 use:class="span*"
where * is a number of columns of width.使用twitter bootstrap 2时,请使用:class="span*"
其中*是宽度的列数。
<tr class="something"><td class="span2">A</td><td class="span3">B</td><td class="span6">C</td><td class="span1">D</td></tr>
** If you have<th>
elements set the width there and not on the<td>
elements.**如果您有<th>
元素,请在此处而不是在<td>
元素上设置宽度。
#6楼
I was having the same issue, I made the table fixed and then specified my td width.我遇到了同样的问题,我将表固定了,然后指定了td宽度。If you have th you can do those as well.如果您有,也可以做。
table {table-layout: fixed;word-wrap: break-word;}
Template:模板:
<td style="width:10%">content</td>
Please use CSS for structuring any layouts.请使用CSS构造任何布局。