1

こんにちは、テキストのすぐ周りのテーブルセルの周りに境界線を付けようとしています...テーブル全体の長さを伸ばしていません。その周りに境界線があるセクション

ここに画像の説明を入力

CSS:

table.content_table {
width: 100%;
margin: 0px;
border-collapse: collapse;
}
table.content_table > tbody > tr > td.results {
border: 2px solid;
background-color: #eeeecc;
font-size: 8pt;
font-weight: bold;
PADDING: 0px;

}

HTML:

    <table class="content_table">
    <br/><br/>
     <h1>Planned Vs Actual Productions Drilldown</h1>


            <tr>
            <td class="results">
         Number of results returned:  ${fn:length(beans)}
        </td>
        </tr>
4

3 に答える 3

2

答えは、テーブル幅が100％であるという事実にあります。TDレベルでのスタイリングがない場合、TDは自動的に可能な限り最大の幅を取ります。

ただし、より大きな問題は、なぜテーブルを使用しているのかということです。これはデータの単一列であり、ここにテーブルは必要ありません。divを使用するだけです。

于 2012-12-10T18:29:52.677 に答える
2

テキストに単純なスパンまたは div p のような他のブロック要素を指定します... インラインブロックを使用したスパンも、境界線を持つことができるブロック要素です。

table.content_table {
  width: 100%;
  margin: 0px;
  border-collapse: collapse;
}
.border {
  border: 2px solid;
  background-color: #eeeecc;
  font-size: 8pt;
  font-weight: bold;
  PADDING: 0px;
  display: inline-block;
}

テーブル内の要素はTDにある必要があるため、有効なhtmlです...別のtr> tdをこのようにテーブルに入れます

<table class="content_table">
<tr>
   <td>
     <h1>Planned Vs Actual Productions Drilldown</h1>
   </td>
</tr>
  <tr>
    <td class="results">
        <span class="border">Number of results returned:  ${fn:length(beans)}</span>
    </td>
    </tr>
</table>
于 2012-12-10T18:34:21.467 に答える