0

どうすればこれを達成できますか?

<table border="0">
  <tbody>
    <tr>
      <td style="margin-right:5px;">
        <h2 id="optiona" class="option optiona optiona2">a. aa   </h2>
      </td>
      <td style="margin-right:5px;">
        <h2 id="optionb" class="option optionb optionb2">b. a   </h2>
      </td>
    </tr>
    <tr>
      <td style="margin-left:5px;">
        <h2 id="optionc" class="option optionc optionc2">c. aa   </h2>
      </td>
      <td style="margin-left:5px;">
        <h2 id="optiond" class="option optiond optiond2">d.    </h2>
      </td>
    </tr>
  </tbody>
</table>

このようなもの(およびCSS)を使用する:

<h2 style="display:inline;" id="optiona" class="option optiona optiona1">a. a   </h2>
<h2 style="display:inline;" id="optionb" class="option optionb optionb1">b. aaa   </h2>
<br />
<h2 style="display:inline;" id="optionc" class="option optionc optionc1">c. aaa   </h2>
<h2 style="display:inline;" id="optiond" class="option optiond optiond1">d. aa   </h2>

JavaScriptやjQueryP.S
のオプションも利用できます。私はコンテンツをまったく制御できず、かなり長い可能性があります(長すぎる場合は、ラップする必要がありますが、自動的に行われると思います)。そのため、固定幅はありません。
テーブルで、列の最長のセルの幅が200ピクセルの場合、列全体が200ピクセルになりますが、htmlとcssだけでこれを行うにはどうすればよいですか?基本的に、h2要素を次のように並べる必要があります。

a.aaaaa b.a
c.a     d.aaa
4

1 に答える 1

1

displayテーブルを模倣するプロパティを使用できます。ただし、古いブラウザで動作するかどうかはわかりません。

http://ecommercedeveloper.com/articles/1941-css-display-table-display-table-row-and-display-table-cell/

http://ajaxian.com/archives/display-table

互換性:

http://caniuse.com/css-table

于 2012-10-16T01:29:12.477 に答える