Sözcük kaydırma HTML tablosunda

SORU

11 AĞUSTOS 2009, Salı

Sözcük kaydırma HTML tablosunda

word-wrap: break-word divs spans metin sarmak için kullanıyorum. Ancak, tablo hücreleri ile çalışmak için görünmüyor. Bir tabloda bir satır ve iki sütun ile width:100%, yaptım. word-wrap yukarıdaki ile tarz olsa da sütunları, metni kaydır yok. Metni hücre sınırları aşmak olur. Bu Firefox, Google Chrome ve Internet Explorer üzerinde olur.

Kaynak gibi görünüyor:

td {
  border: 1px solid;
}

<table style="width: 100%;">
  <tr>
    <td align="left">
      <div style="word-wrap: break-word;">Long Content</div>
    </td>
    <td align="right"><span style="display: inline;">Short Content</span>
    </td>
  </tr>
</table>

"Uzun İçerik" benim sayfa sınırları daha büyük, ama yukarıdaki HTML ile sonu gelmez. Aşağıdaki öneriler text-wrap:suppress text-wrap:normal, ekleme çalıştım ama ne yardım etti.

CEVAP

10 Aralık 2009, PERŞEMBE

Aşağıdaki İnternet Explorer benim için çalışıyor. table-layout:fixed CSS eklenmesi özniteliği dikkat edin

td {
  border: 1px solid;
}

<table style="table-layout: fixed; width: 100%">
  <tr>
    <td style="word-wrap: break-word">
      LongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongWord
    </td>
  </tr>
</table>

Bunu Paylaş: