IE 8兼容模式导致表单提交按钮打包

下面的代码在我使用兼容模式时除了IE以外，在浏览器中执行的操作。在兼容模式下，提交（删除）按钮将包装到下一行。谁能帮忙？它应该看起来像在不使用兼容模式时在Firefox或IE中执行的操作。无法使用float：left/right，因为我无法事先指定长度。IE 8兼容模式导致表单提交按钮打包

感谢您的任何帮助。

<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>

来源

2010-03-29 Robert

<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-29 03:43:26 Leo

谢谢您的答复。您的解决方案的工作原理是按钮不再包装，但我忘了补充说我希望提交（删除）按钮排列在右侧。否则，我会把所有的东西都抛开。对不起，这是一个痛苦。 – Robert 2010-03-29 18:17:56

IE 8兼容模式导致表单提交按钮打包

回答

相关问题