- ベストアンサー
ブログ内の空白削除方法
- ブログ内のタイトル画像とその下のラインの間の空白を削除する方法について教えてください。
- ブログのテンプレートをいじっても空白が削除できないので、他の方法があれば教えてください。
- ブログの空白を埋めたいのですが、テンプレートを変更しても上手く行かない場合はどうすれば良いですか。
- ブログ
- 回答数2
- ありがとう数23
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
ご丁寧にありがとうございます。 開始タグの件ですが、私の書き方も悪かったんですが<a><h1>ではなく<h1><a>です。入れ子の内と外はきちんと一致させてください。現状ではブラウザが強引に把握してくれるようですが… スタイルシートについて、ごく単純にお答えすると「h1のmargin-bottom」で調整です。上手くいかない場合は「h2のmargin-top」と同時に調整してください。質問者さんの狙いは分かりませんので具体的な数値は残念ながら出せません。 …あとから気づいたのですが、タイトルは画像なのですから<h1>で囲うのはどうなのかと疑問を感じました。音声ブラウザには優しい気もしますが…
その他の回答 (1)
<img>の手前に<a><h1>の開始タグが見当たりませんがコピペのミスということでいいんでしょうか？ どちらにしても<img>とその直下の要素がどちらも<hn>ですから見出し扱いされます。 ブラウザはInternetExpolerですか？その場合見出し同士(<h1>と<h2>)の間に隙間は発生する仕様です。どうしても詰めたい場合はスタイルシートを使ってください。
補足
ありがとうございます。コピペミスではありません。自分でいじったのか元々なのかは分かりません。<a><h1>を追記しましたが、やはり改善されませんでした。ブラウザはおっしゃるとおりIEです。スタイルシートをどのようにすればよいのか・・・こんな状態です。コピペミスはありません。 body { color: #ffffff; font-size: 14px; background-color: #000; text-align: center; margin: 0px; padding: 0px; } input, textarea { border: 1px solid #000; font-size: 14px; } form { padding: 0px; margin: 0px; } .container { margin-left: auto; margin-right: auto; width: 780px; background-color: #000; } a:link { color:#ADDE4A; text-decoration: underline; } a:visited { color: #E0FAAC; text-decoration: underline; } a:hover { color: #E0FAAC; text-decoration: underline; } .banner { width: 780px; padding: 0px; clear: both; margin: 0px 0px 15px 0px; } .banner_title { text-align: left; border-bottom: 1px solid #fff; background-color: #000; } .side_left { float: left; overflow:hidden; width: 180px; } .side_right { float: left; overflow:hidden; width: 180px; } .main { float: left; overflow:hidden; width: 600px; } .entryBodybox { width: 580px; margin: 0px 5px 10px 5px; text-align: left; border-top: 0px solid #000; border-right: 1px solid #8B898B; border-bottom: 1px solid #8B898B; border-left: 1px solid #8B898B; } .entry_title { font-size: 14px; font-weight: bold; letter-spacing : 1px; padding: 3px 5px 3px 10px; border-top: 1px solid #8B898B; border-right: 0px solid #8B898B; border-bottom: 0px solid #000; border-left: 0px solid #8B898B; background-color:#000; } .entry_title a { text-decoration : none; } .entry_title a:hover { text-decoration : underline; } .entry_body { font-size: 14px; line-height: 150%; font-family: "Verdana", "ＭＳ Pゴシック", "Osaka"; margin: 15px 10px 5px 10px; } .entry_state { font-size: 12px; color: #8B898B; font-family: "Verdana", "ＭＳ Pゴシック", "Osaka"; text-align: center; margin: 20px 0px 20px 0px; clear: both; } .comtitle { font-weight: bold; color:#ffffff; padding-left: 10px; } .tbtitle { font-weight: bold; color:#8B898B; padding-left: 10px; padding-top: 10px; } blockquote { font-size: 12px; margin: 5px; padding: 5px; background-color:#8B898B; border-top: 1px solid #8B898B; border-right: 1px solid #8B898B; border-bottom: 1px solid #8B898B; border-left: 3px solid #8B898B; } .nav { margin-bottom: 10px; } .sideSet { width: 170px; margin: 0px 5px 20px 5px; text-align: left; border-left: 1px solid #000; border-right: 1px solid #000; border-bottom: 1px solid #000; } .sidetitle { font-family: "Verdana", "ＭＳ ゴシック", "Osaka"; font-size: 12px; font-weight: bold; color: #fff; text-align: center; border-top: 1px solid #8B898B; border-bottom: 1px solid #8B898B; border-left: 1px solid #8B898B; border-right: 1px solid #8B898B; background-color: #000; padding: 4px 0px 2px 5px; } .sidetext { padding: 5px 2px 7px 2px; font-size: 12px; color: #8B898B; line-height: 140%; } .sidetext ul { padding: 0px; margin: 0px; list-style-type: none; } .sidetext li { background-repeat: no-repeat; background-position: 3px 5px ; color: #666; padding: 0px 0px 0px 0px; margin: 0px; } .prfimg { text-align: center; } .pagetop { color: #fff; font-size: 11px; text-align: right; margin: 0px 0px 20px 0px; } #sun { color: #c00; } #sat { color: #5982b2; } .footer { clear: both; width: 100%; font-size: 12px; text-align: center; letter-spacing : 1px; margin: 30px 0px 0px 0px; padding: 3px 0px 3px 0px; background-color:#000; border-top:1px solid #fff; }
お礼
ご回答ありがとうございました。取りあえずなんとかなったので 助かりました。感謝いたします！
補足
遅くなってくみません、結局h1タグをを削除し、代わりに<br>を入れてみました。あと、h2を削除したら本題が解決したのですが、その上のタイトル画像の直下（画像の下部分）にラインがくっついています。これを削除するにはどのようにすれば良いのでしょうか？色々やってみたのですがイマイチ分からなくて・・・。