0

以下のコードは、互換モードを使用している場合にIEを除いてチェックするブラウザーで必要なことを実行します。

互換モードでは、送信（Remove）ボタンは次の行に折り返されます。互換モードを使用していない場合は、FirefoxまたはIEの場合と同じように表示されます。

float:left/right事前に長さを指定できないため使用できません。

<div>
  <ul style="display:inline-table">
    <li style="text-align:left; white-space:nowrap">
      <div>
        <div style="display:table-cell; width:100%"><b>Name: </b>Test Name That is Longer Than The Other <b>Qty: </b>1</div>
        <div style="display:table-cell">
          <form style="margin:0; padding:0" name="remcart" method="post" action="page_name.html">
            <input name="Quantity" value="0" type="hidden" />
            <input style="margin:0; padding:0; margin-left:5px" type="submit" value="Remove" name="rembutton" />
          </form>
        </div>
      </div>
    </li>
    <li style="text-align:left; white-space:nowrap">
      <div>
        <div style="display:table-cell; width:100%"><b>Name: </b>Short Test Name <b>Qty: </b>1</div>
        <div style="display:table-cell">
          <form style="margin:0; padding:0" name="remcart" method="post" action="page_name.html">
            <input name="Quantity" value="0" type="hidden" />
            <input style="margin:0; padding:0; margin-left:5px" type="submit" value="Remove" name="rembutton" />
          </form>
        </div>
      </div>
    </li>
  </ul>
</div>

4

1 に答える 1

0 
<style>
    form {
        display: inline;
    }
</style>

<ul style="display:inline-table">
    <li style="text-align:left; white-space:nowrap">
        <div>
            <span><b>Name: </b>Test Name That is Longer Than The Other <b>Qty: </b>1</span>
            <form style="margin:0; padding:0" name="remcart" method="post" action="page_name.html">
            <input name="Quantity" value="0" type="hidden" />
            <input style="margin:0; padding:0; margin-left:5px" type="submit" value="Remove" name="rembutton" />
            </form>
        </div>
    </li>
    <li style="text-align:left; white-space:nowrap">
        <div>
            <span><b>Name: </b>Test Name That is Longer Than The Other <b>Qty: </b>1</span>
            <form style="margin:0; padding:0" name="remcart" method="post" action="page_name.html">
            <input name="Quantity" value="0" type="hidden" />
            <input style="margin:0; padding:0; margin-left:5px" type="submit" value="Remove" name="rembutton" />
            </form>
        </div>
    </li>    
</ul>
于 2010-03-29T03:43:26.150 に答える