テーブルの行に固定位置を使用するとFirefoxの問題が発生する

テーブルのスクロール可能なヘッダーが必要です。だから私は、スタイルに固定された位置を使うことに決めました。問題は、Firefox & Chromeで幅が縮小されていることです。 Mozillaではうまく動作します。あなたの参照のために私はHTMLテーブルコードを掲示しました。テーブルの行に固定位置を使用するとFirefoxの問題が発生する

<html> 
<head> 
</head> 
<body> 
    <table width="150%"> 
     <thead> 
     <tr> 
      <th width="50%" align="left">Head 1</th> 
      <th width="50%" align="left">Head 2</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     <tr> 
      <td>Value 1</td> 
      <td>Value 2</td> 
     </tr> 
     </tbody> 
     <tfoot> 
     <tr><td>Foot 1</td></tr> 
     </tfoot> 
    </table> 

</body> 
</html>

出典

2012-02-14 Riyaz Ahamed

これはいかがですか？

<th align="left" style="position:fixed;float:left;">Head 1</th> 
<th align="left" style="position:fixed;float:right;left:75%;">Head 2</th>

出典

2012-02-14 07:54:43 Atrh

私はこれを試しました。これを探していない、スクロールバーがテーブルのために来る。私はテーブルのスクロールを望んでいない、スクロールバーは、ページ全体のために来ると、テーブルのヘッダーは垂直だけでなく、水平スクロールする必要があります。 –

注：私のテーブルの幅は100％ではない150％です –

それは水平スクロールのために働いています。垂直スクロールでは機能しません。 –

テーブルの行に固定位置を使用するとFirefoxの問題が発生する

答えて

関連する問題