- 締切済み
セル内の余白について
こんにちは。 いつもお世話になっています。 下記のXHTMLとスタイルシートで作業を進めているのですが、＜ｈ１＞要素の入るセルで下の部分に余白ができてしまい困っています。 文章を改行してみたところ行間のスペースはきっちり締まっていたのでセルの方をどうにかしたほうがいいのでしょうか？ すでにいろいろ試した状態でコピーしたので余計な記述も混じっているかもしれません。 希望としては＜ｈ１＞要素の文字幅ちょうどで高さを収めたいのです。 初心者のため、質問対象以外の部分でもお気づきの点がありましたら合わせてご指導いただければと思います。 よろしくお願いします。 ○ ＨＴＭＬ <?xml version="1.0" encoding= "Shift_JIS" ?> <!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> <title>○○住設ＨＰベース</title> <link href="ＣＳＳトップ.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="5contents"> <table cellspacing="0" cellpadding="0"> <tr class="kensaku"> <td colspan="6"> <h1 >○○県でエコキュート・ＩＨクッキングヒーターなど 『オール電化』機器を販売・施工しています。</h1> </td> </tr> <tr> <td class="syamei" rowspan="2" colspan="2"> <h2>株式会社</h2> <h2>○○住設</h2></td> <td class="menu"> <h3><a href="">ＨＯＭＥ</a></h3></td> <td class="menu"> <h3><a href="">キャンペーン</a></h3></td> <td class="menu"> <h3><a href="">光熱費試算</a></h3></td> <td class="menu"> <h3><a href="">Ｑ＆Ａ</a></h3></td> </tr> <tr> <td class="menu"> <h3><a href="">会社案内</a></h3></td> <td class="menu"> <h3><a href="">取扱商品</a></h3></td> <td class="menu"> <h3><a href="">施工事例</a></h3></td> <td class="menu"> <h3><a href="">お問い合わせ</a></h3></td> </tr> </table> </div> </body> </html> ○ ＣＳＳ table { vertical-align: middle; } tr.kensaku { height: 15px; width: 762px; padding: 0px; margin: 0px; vertical-align: middle; } h1 { font-size: 10pt; line-height: 10pt; padding-bottom: 0px; }
- kobutoriman085
- お礼率78% (74/94)
- HTML
- 回答数4
- ありがとう数0
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- leap_day
- ベストアンサー率60% (338/561)
こんにちは <h>を使うのであれば h1 { margin:0px; } h2 { margin:0px; } h3 { margin:0px; } を追加すればいいと思います <h>を使わないでも<th>やcssのfont-weightなどを使えば同じように出来ます あとidの初めに数字を使うのは控えた方がいいかと思います <style type="text/css"> table { margin:auto; } th.kensaku { font-size: 10pt; } th.syamei { font-size: 18pt; width:130px; } td.menu { font-size:14pt; font-weight: bold; width:130px; } </style> <div id="contents"> <table cellspacing="0" cellpadding="0"> <tr> <th colspan="5" class="kensaku"> ○○県でエコキュート・ＩＨクッキングヒーターなど 『オール電化』機器を販売・施工しています。 </th> </tr> <tr> <th class="syamei" rowspan="2"> 株式会社 ○○住設</th> <td class="menu"> <a href="">ＨＯＭＥ</a></td> <td class="menu"> <a href="">キャンペーン</a></td> <td class="menu"> <a href="">光熱費試算</a></td> <td class="menu"> <a href="">Ｑ＆Ａ</a></td> </tr> <tr> <td class="menu"> <a href="">会社案内</a></td> <td class="menu"> <a href="">取扱商品</a></td> <td class="menu"> <a href="">施工事例</a></td> <td class="menu"> <a href="">お問い合わせ</a></td> </tr> </table> </div>
- CHI-512
- ベストアンサー率69% (63/91)
こんにちは。 スタイルシートをこうしたらいかがでしょう？ h1 { font-size: 10pt; line-height: 0; padding: 0; margin: 0; } paddingとmarginを“0”にするだけでOKっぽいですが、 line-height: 0;でさらにGoodかと。
> <link href="ＣＳＳトップ.css" rel="stylesheet" ・・・ 日本語のファイル名は使わない方が無難です。
- yambejp
- ベストアンサー率51% (3827/7415)
marginをけずってください h1 { font-size: 10pt; line-height: 10pt; padding-bottom: 0px; margin:0px; }
