Question

使用ckeditor用户可以在其列表中添加说明。某些描述的表宽比包含div宽。我们如何强制描述适合包含div？

<div style="float:left; padding-top: 4px; font-size:13px; width:500px; border-style:solid;">                    
<table border="1" cellpadding="0" cellspacing="0" style="width:576px; height: 120px;">          
  <tr height="39">          
    <td height="39">                
      <p>                   
        <span style="font-size:16px;">
          <span style="color: rgb(255, 140, 0);">APPLE FACTORY RECERTIFIED IPAD/1ST-GENERATION TABLET APPLE:
          </span>
        </span>
      </p>              
      <p>                   &nbsp;
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">A4/A4X1-1.00G 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">256MB/1-DIMM 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">16GB/FLASH 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">802.11A/B/G/N+BT INTEGRATED-GRAPHICS/0MB 9.7WXGA-
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">TOUCHSCREEN/MULTI-TOUCH APPLE/IOS-4.0 1.5LBS 1YR
          </span>
        </span>
      </p>          </td>       
  </tr>
</table>
<p> &nbsp;
</p>                       
</span>            
</div>

Answer 1

您还可以在第一个div样式中添加overflow: hidden;属性，如下所示：

<div style="float:left; padding-top: 4px; font-size:13px; width:500px; border-style:solid; overflow: hidden;">                    
<table border="1" cellpadding="0" cellspacing="0" style="width:576px; height: 120px;">          
  <tr height="39">          
    <td height="39">                
      <p>                   
        <span style="font-size:16px;">
          <span style="color: rgb(255, 140, 0);">APPLE FACTORY RECERTIFIED IPAD/1ST-GENERATION TABLET APPLE:
          </span>
        </span>
      </p>              
      <p>                   &nbsp;
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">A4/A4X1-1.00G 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">256MB/1-DIMM 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">16GB/FLASH 
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">802.11A/B/G/N+BT INTEGRATED-GRAPHICS/0MB 9.7WXGA-
          </span>
        </span>
      </p>              
      <p>                   
        <span style="font-size: 16px;">
          <span style="color: rgb(255, 140, 0);">TOUCHSCREEN/MULTI-TOUCH APPLE/IOS-4.0 1.5LBS 1YR
          </span>
        </span>
      </p>          </td>       
  </tr>
</table>
<p> &nbsp;
</p>                       
</span>            
</div>

它将剪切重叠文本，但它将适合父div。

Answer 2

强制它只为表提供max-width属性。您已将width属性设置为576px，其肯定大于500px div。

style="max-width:500px; height: 120px;">

招呼

儿童表重叠父div

2 个答案: