- ベストアンサー
CSSでおかしな表示が
現在市販の本でCSSを学んでいる初心者のものです。 XHTMLとCSSの基本の本です。 こちらはその教科書をやっていて出てきました。 CSSのファイルがあり、そちらにaddressのところにborder-topをいれるとなぜがボーダーが上下に出来てしまいます。 太さが指定したものより細く出ているのでもしかしたら上に出ている線がどういうわけか割れて上下にでているのではないかともみえなくはないのですが。 topをbottomに変えると普通に下のみに線が入ります。 なにがおこっているのかよくわかりません。 ブラウザの設定が原因でしょうか。 教科書とは同じように入力しているとは思うのですが。 教えてください。 よろしくお願いいたします。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<address>Copyright© Hiiragi Real Estate. All Rights Reserved.<br /> 2006年1月20日更新<address/> これを <address>Copyright© Hiiragi Real Estate. All Rights Reserved.<br /> 2006年1月20日更新</address> に直してみたらどうでしょうか。
その他の回答 (2)
- tkmojo
- ベストアンサー率50% (105/207)
border-topで上下にボーダーが表示される、という現象は私は見たことがありません。 ブラウザの設定ではないと思います。 予想ですが、cssではなくhtmlの記述ミスではないでしょうか？ <adress>○○○○○○</adress>と書くべきところを <adress>○○○○○○<adress>と書いてしまったらそうなるかも。 上記でないならば・・・ソースを見ないと何とも言えません。 教科書に載っているサンプルならあまり長くもならないと思うので 今記述しているhtmlとcssをここに貼り付けて質問してみてはどうでしょうか？ あと、どのブラウザのどのバージョンで確認しているかを書くと他の方も回答しやすいと思います。
お礼
早速のお返事有難うございます。 addressの綴りはあっていたようですがちょうど今他の方から答えがこちらに投稿を頂きまして解決しました。 ご返答いただき感謝しております。 皆様のおかげで解決いたしました。 有難うございました。
補足
なんどもばらばらとすみません。 ブラウザのバージョンはは7.0だと思います。 すみませんがよろしくお願いいたします。
- os6v100i
- ベストアンサー率44% (16/36)
どのように記述したのか提示していただかないと、誰も回答できないと思いますよ？
お礼
早速のご回答有難うございました。 たった今他の方の投稿で解決いたしました。 ご返答いただいたことには感謝しております。 すぐにお返事いただいたのに資料がそろっていなくて申し訳ありませんでした。 質問を投稿するときにファイルを最後に添付しようとしたら出来ず困っていたらお返事を先に頂いてしまったようで。。。 ありがとうございました。
補足
失礼いたしました。先ほどの質問でファイルを添付できなかったのでこちらでできるかぎり表示してみます。 index.htmlのファイル <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//DTD XHTML 1.0 Strict//EN" "http://www.W3.org/TR/DTD/xhtml1/xhtml.dtd"> <html xmlns="http://www.W3.org/1999/xhtml" xhtml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <link rel="stylesheet" href="css/mystyle.css" type="text/css" /> <title>ひいらぎ不動産</title> </head> <body> <img src="image/logo.gif" alt="ひいらぎ不動産" width="300" height="56"/> <h1>ひいらぎ不動産へようこそ</h1> <p><em>ひいらぎ不動産</em>は、この<strong>街</strong>であなたの理想の部屋をお探しいたします。</p> <img src="image/fuukei.jpg" width="525" height="131" alt="風景写真"> <h2>キャンペーン情報</h2> <p>2006年1月20日～2006年2月10日の間にご契約いただいた方は、仲介手数料を半額キャンペーン中。<br /> 2006年4月末完成予定のマンション「アイビーハイム青島」の入居者募集中。<br /> 詳しくはお電話にてお問い合わせください。</p> <address>Copyright© Hiiragi Real Estate. All Rights Reserved.<br /> 2006年1月20日更新<address/> </body> </html> mystyle.cssのファイル h1{ background-image:url(../image/line.gif); background-repeat:repeat-x; color:#333333; font-size:150%; } address{ color:#003366; font-weight:bold; font-size:70%; text-align:right; border-top:5px solid #003366; } h2{ color:#003366; font-size:120% } p{ font-size:90%; } 質問は先ほどとインターネットエクスプローラで一番下のaddressに当たるところに設定したborder-topが正しく表示されない、です。 topをbottomに変えると正しく表示されます。
お礼
ありがとうございました。たすかりました。 ご指摘の場所を直してみました。 直りました。 有難うございました。