テーブル<TR> mozillaの高さ

ここには1ピクセルの高さと100パーセントの2つのフィールドがあるテーブルがあります。この例は明らかにGoogle Chromeに見えます。しかし、Mozillaでは動作しません。 Mozillaでの修正方法テーブル<TR> mozillaの高さ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head profile="http://gmpg.org/xfn/11"> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <style> 
    *{margin: 0; padding: 0;} 
    html, body{position: relative; width: 100%; height: 100%; overflow: hidden;} 
    table{height: 100%; width: 100%; position: relative;} 
</style> 
</head> 
<body> 
    <table cellpadding="0" cellspacing="0" height="100%"> 
     <tbody height="100%" > 
      <tr> 
       <td height="100%" valign="top"> 
        <div style="overflow: auto; height: 100%"> 
         sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />sdfsdf<br />a1 
         afasdasd sdfs sdv 
        </div> 
       </td> 
      </tr> 
      <tr> 
       <td height="1" valign="top"> 
        test<br />test<br />test<br />test<br />test<br /> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</body> 
</html>

出典

2011-02-27 Жасулан Бердибеков

私は、Mozillaエンジンは<td>タグのHTML height属性を解釈しているかどうかはわかりませんが、あなたは代わりに、スタイリングのためのCSSを使用してより良い結果を得る可能性があります。

<td style="height: 1px; vertical-align: top;">

... ...

td.shortcell {height: 1px; vertical-align: top;}

またはインラインをHTMLで

...

あなたのスタイルブロックで

<td class="shortcell">

UPDATE：あなたのようなものを試してみましたCSSの高さ属性はブロックレベルの要素に対してのみ機能するため、次の要素を使用できます。

td.shortcell {height: 1px; vertical-align: top; display: block}

これはうまくいくが、ぶつかることになる。 DIVをテーブルのセルの中に入れ、その高さを適用する方が良いでしょう。

HTML ...

<td> 
    <div class="shortcell"> 
    contents here 
    </div> 
</td>

とCSS：

.shortcell {height: 1px;}

出典

2011-02-27 06:41:12 Greg

これも機能しません。 –

はい、高さが機能するにはブロックレベルの要素が必要です。私の答えの更新を参照してください。 – Greg

それは、クロム10、最新のFFの両方で、最初は私のために働きました。この例では、「テーブル内の高さの99％または100％の行がChromeで自動伸縮できない理由」を理解するのに役立ちました。このバグは多くの場所で議論されていましたが、多くの解決策はありませんでした。この実例では解決策を見つけ出すことができました： "高さを99％または100％ Chrome 10で自動サイズ変更されるテーブルの行は、親テーブルの高さを100％にすることです "

出典

2011-05-03 15:39:10 Eugene

テーブル<TR> mozillaの高さ

答えて

関連する問題