Firefox rowspan問題

我需要一些在firefox中使用rowspan的幫助。我需要1個大單元格和30個行（每行7個單元格）較小單元格旁邊的大單元格。它在Chrome中的工作原理與我想要的完全一樣，但FF可以拉伸所有較小的單元格，以使整個桌子呈矩形或方形。Firefox rowspan問題

在http://stinak.com/?s=1&u=1遇到此問題（如集合/ S/S 2012）

我想迫使FF使這些表看起來相同的Chrome。這意味着即使行數小於rowspan中設置的行數，也會對齊頂部的所有行。

來源

2011-08-29 Madr

我不知道這個規格有什麼要說的，但Chrome的行爲看起來不對。我的其他瀏覽器（Opera，Firefox和Internet Explorer）都不會以這種方式呈現表格。

我覺得這是比較容易擺脫表：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head><title></title> 
<style type="text/css"><!-- 
div.gallery{ 
    width: 750px; 
    font-size: 0; 
    overflow: hidden; 
} 
div.gallery div.large{ 
    float: left; 
    width: 400px; 
} 
div.gallery div.thumbs{ 
    float: left; 
    width: 350px; 
} 
div.gallery div.thumbs div{ 
    display: inline-block; 
} 
--></style> 
</head> 
<body> 


<div class="gallery"> 
    <div class="large"><img src="http://placehold.it/400x600"></div> 

    <div class="thumbs"> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 

      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 

      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 

      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 

      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
      <div><a href="javascript:;"><img src="http://placehold.it/50x75"></a></div> 
     </div> 
</div> 

</body> 
</html>

實現精確的像素佈局與表可以是一個噩夢。

來源

2011-08-29 16:40:34

看來divs在這個特定問題上比表格更好，反正謝謝。 – Madr

@Madr - 這實際上是一個普遍問題。在表格中設置特定的單元格高度總是幾乎不可能。 –

Firefox rowspan問題

回答

相關問題