- ベストアンサー
bodyとtdのフォントサイズの依存関係
body、tdのフォントサイズの依存について教えて頂きたい事があります。 <style> body{font-size:85%;} td{font-size:85%;} </style> とした時、 <body> フォントサイズ(bodyに直接)<br /> <table> <tr> <td>フォントサイズ(テーブル１つ)</td> </tr> </table> <table> <tr> <td> <table> <tr> <td>フォントサイズ(テーブル２重ネスト)</td> </tr> </table> </td> </tr> </table> </body> bodyのフォントサイズ > テーブル１つのフォントサイズ > テーブル２つのフォントサイズ とネストをする毎にフォントが小さくなります。 この現象を回避する事は出来ますでしょうか。 上記を全て同じフォントサイズにしたい次第です。 ご存知の方がいましたらアドバイス頂けませんでしょうか。 よろしくお願いします。 確認環境は Win IE6 mac Safari3 Firefox2 で上記の動作になります。 Winのfirefoxでは、テーブルをネストしてもフォントのサイズは一緒でした。(body > table1つ = table2つ)
- kakekake_07
- お礼率63% (19/30)
- HTML
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
％での指定は相対指定なので、子要素に継承されます。 firefoxはtdを入れ子にした場合継承されないので、１重と２重のフォントサイズが同じになります。 （なぜそうなるかは詳しい人が解説してくれるでしょう！） tdをfont-size:100% にすればbodyと同じになります。 なおtableの入れ子はxhtmlでは間違った記述なのでご注意を。
その他の回答 (1)
- goldfox
- ベストアンサー率49% (123/249)
上記ソースを試しましたが、winXP IE6,Firefox ともに、文字サイズは同じでした。 body{font-size:85%;} table{font-size:85%;} もしくは body,table,td{font-size:85%;} とか、tableセレクタにもやっていませんか？
補足
ありがとうございます。 スタイルの指定は記述したものだけです。 ソースを全部コピーしますと、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> <style> body table td { margin:0px; padding:0px} body { font-size:85%; } td { font-size:85%; } </style> </head> <body> フォントサイズ(bodyに直接)<br /> <table> <tr> <td>フォントサイズ(テーブル１つ)</td> </tr> </table> <table> <tr> <td> <table> <tr> <td>フォントサイズ(テーブルネスト)</td> </tr> </table> </td> </tr> </table> </body> </html> です。 DOCTYPEとか関係あるのでしょうか。。。
お礼
ありがとうございます。tdのフォントサイズは操作せず、bodyのみの操作で同じ大きさに成る事が確認出来ました。どうもありがとうございます。
補足
テストした所、DOCTYPEによってbodyとtdのフォントの依存関係が分かりました。 DOCTYPEが指定していない場合、とTransitionalだけど、URLの指定がない場合は、bodyとtdのフォントのサイズは依存しませんでした。 Transitional+URLとstrictの場合は、bodyとtdのフォントサイズは依存し、さらに、tableのネスト時にtdのサイズは上のtdに依存しました。