- ベストアンサー
スタイルシート DIVとDIVの間に隙間ができてしまいます。
DIVとDIVの間に１０ピクセルほどの隙間ができるのはなぜでしょうか？ ｈｔｌｍは <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 8.0.0.0 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <META name="IBM:HPB-Input-Mode" content="mode/flm; pagewidth=750; pageheight=900"> <TITLE>タイトル</TITLE> <link rel="stylesheet" href="style_1.css" type="text/css"> </HEAD> <BODY> <DIV id=site> <DIV id=header> <DIV id=top-logo><IMG src="logo2.gif" border="0" alt="ロゴ"> </DIV> <hr color="#ffccff" width="750" height="2"> </DIV> </DIV> </BODY> </HTML> 上部の方はよくわからなくてホームページビルダーのをコピーして、残りはメモ帳で手打ちしました。 スタイルシートは、全て手打ちです。 *{ margin:0px; padding:0px; } #site { width: 760px; border: 2px solid pink; font-size: 90%; line-height: 150%; margin:0px; padding:0px; border: 1px solid red; } #header { width: 760px; border: 1px solid blue; } #top-logo { FLOAT: left; border: 1px solid green; } #siteと#headerの赤と青のボーダーはぴったりくっついているのに、#top-logoの上に隙間があります。 ｈｒの線の下にも１０ｐｘ分くらいの隙間があります。 なぜこのような隙間ができてしまうのでしょうか？
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
>#top-logoの上に隙間があります 確認できません。 IMG タグに、width と height を入れてみるとどうでしょう。 >ｈｒの線の下にも１０ｐｘ分くらいの隙間があります 全角スペースが入っています。 全部で3ヵ所 <link rel="stylesheet" href="style_1.css"■type="text/css"> ■<hr color="#ffccff" width="750" height="2"> ■</DIV> インデントは、半角スペースかタブで。
その他の回答 (1)
divが入れ子になっているので、間は存在しないのでは。 cssで#siteでborderを二回指定しています。 後 id="site" の様に " で囲んでください。
お礼
ご回答ありがとうございます。 たしかに＃siteでborderを２回指定していますね。 あと、””で囲んだのですが、やはり隙間が存在してしまいます。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/images/related_qa/c205_2_thumbnail_img_sm.png)
お礼
なるほど、全角スペースがカギだったのですね！ IMGタグのwidthとheightはサイズがよくわからないのでいれませんでしたがうまくいきました。 ありがとうございます。 本当に助かりました！ 上部の隙間が確認できなかったということですが、 こちらにペーストする際、行が汚かったので多少修正してしまったせいかもしれません。 試しにこちらのソースをコピーしてエクスプローラーでみてみると上の隙間はありませんでした。失礼したしました。