Rowspan ile tablo hücre hizalaması

Question

Bir satır belleği olan bir hücreye sahip bir HTML tablom var. Temelde soldaki sadece bir satırdaki rowspan = 2 ve sağdaki 2 sütun. Sağ taraftaki sütunların üstüne yapışmasını istiyorum. Bununla birlikte, sağ taraftaki boşluk iki sütun arasında eşit olarak bölünmüştür. Yükseklik ekleme: Sağ taraftaki son sütuna% 100, Chrome'da hile yapar, ancak FF veya IE'de çalışmaz.

<table border="1" style="width: 200px;"> 
<tr> 
    <th>Col1</th> 
    <th>Col2</th> 
    </tr> 
    <tr> 
    <td rowspan="2">Some long cell here...The point is that the Col_A and Col_B should both stick to the top. I tried adding height: 100% to the last column (Col_B) but that does only work in Chrome. Firefox puts Col_B at the very bottom while IE seems to completely ignore it.</td> 
    <td>Col_A</td> 
    </tr> 
    <tr> 
    <td>Col_B</td> 
    </tr> 
</table> 

Fiddle: https://jsfiddle.net/jtr1r132/1/

Güncelleme: Chrome ve FF için hile sağa (Col_A) ilk sütuna 1px kapsamaz: Pragnest olarak

yükseklik ekleyerek aşağıda önerdi. IE (ve Edge) 'de hala amaçlandığı gibi çalışmıyor.

Güncelleme keman: Senin durumunda https://jsfiddle.net/jtr1r132/9

Answer 1

Eğer sonuç elde etmek için bazı alternatif gerekir. Aşağıdaki gibi, ikinci sütundaki yüksekliği kaldırmanız ve ilk sütuna 1 px yükseklik ayarlamanız gerekir, böylece otomatik olarak çıktınızı elde edin. html değişikliği gibi

aşağıda başına -

<table border="1" style="width: 200px;"> 
 
     <tr> 
 
     <th>Col1</th> 
 
     <th>Col2</th> 
 
     </tr> 
 
     <tr> 
 
     <td rowspan="2">Some long cell here...The point is that the Col_A and Col_B should both stick to the top. I tried adding height: 100% to the last column (Col_B) but that does only work in Chrome. Firefox puts Col_B at the very bottom while IE seems to completely ignore it.</td> 
 
     <td style="height: 1px">Col_A</td> 
 
     </tr> 
 
     <tr> 
 
     <td >Col_B</td> 
 
     </tr> 
 
    </table>