Bir html tablo sütun genişliklerini eşitlemek için bir yolu var mı?

4 Cevap php

Ben bu iki tablo varsa:

<table>
<tr>
<td>Small Length Content</td>
</tr>
</table>

<table>
<tr>
<td>Dynamic Content Goes Here And It's Longer Than The TD Above</td>
</tr>
</table>

Iki sütun aynı genişliğe sahip olduğunu nasıl bunu yapabilir?

Ben tabloları birleştirmek öylesine bir seçenek değil şu olamaz. Ben de dinamik içeriği itibaren sabit genişlikleri kullanamazsınız. Herhangi bir fikir? Belki javascript şey üst sütunları alt tablonun genişliği maç var? Ben hiçbir fikrim yok bu yüzden hiçbir js uzman değilim şu muhtemel veya nasıl bunu yapmak için eğer. De bunu çözmek için kullanmak için bir yol gidecekseniz eğer php de masada bir seçenektir.

4 Cevap

Ben 'akan' sütunu üzerinde bir yüzdeye göre genişliğini kullanmak ve gerekirse sabit genişlikte sütunlar ile tampon olacaktır. yani.:


<table style="width: 100%;">
<tr>
<td style="width: 80%;">Small Length Content</td>
</tr>
</table>

<table style="width: 100%;">
<tr>
<td style="width: 80%;">Dynamic Content Goes Here And It's Longer Than The TD Above</td>
</tr>
</table>

Bu dinamik içerik için css tanımlayabilir misiniz? Bu tablolar şöyle bir div içinde yuvalanmış varsayalım:

<div id="content">
  <table>
    <tr>
      <td>Small Length Content</td>
    </tr>
  </table>

  <table>
    <tr>
    <td>Dynamic Content Goes Here And It's Longer Than The TD Above</td>
    </tr>
  </table>
</div>

Ben bu gibi bazı css yazarsınız:

#content table td { width: 80%; }

Bunu gerçekleştirmek için CSS kullanabilirsiniz. Sen artık içerik şal sahip olmak zorunda kalacaktır.

td{
   width:80%;
}

Denemek

<table>
<tr>
    <td style="width:200px">Small Length Content</td>
</tr>
</table>

<table>
<tr>
    <td>Dynamic Content Goes Here And It's Longer Than The TD Above</td>
</tr>
</table>

veya td elemanı isim bir sınıf ekleyebilir ve harici bir dosya gibi ya da başlık tarzı başka bir yerde stil tanımlayabilirsiniz

etiketler