10代と話して驚いたこと

以下のようにboxを作りその中にフロートさせた2つ(div class="b"とdiv id="c"を作り、
div class="b"の方にdiv class="nwesbox"を作り、その中にiframeを入れました。

問題はdiv class="nwesbox"に上下左右に表示指定したborderの線の右側のみブラウザ(ie7)で表示されません?

div id="c"を取り除くと表示されます、nwesboxやiframeの幅を変更したりしてみましたが
解決できなく困っています、どなたか教えていただけますでしょうか?
宜しくお願いします。


以下html記述-----↓
<div class="box">
<div class="b">
<div class="nwesbox"><iframe id="iframe" frameborder="0" scrolling="yes" src="whats.html" title="お知らせ">お知らせ</iframe></div>
</div>
<div id="c">
<p>*****</p>
</div>

以下CSS記述------↓
.box{
width : 898px;
margin-left : 0px;
margin-top : 0px;
padding-left : 0px;
margin-bottom : 0px;
}
.b{
width : 575px;
margin-left : 0px;
margin-top : 10px;
background-color : #ffffff;
padding-left : 10px;
float : left;
margin-right : 0px;
}

.nwesbox{
width : 575px;
height : 233px;
background-color : #ffffff;
border-width : 1px 1px 1px 1px;border-style : solid solid solid solid;border-color : #0080ff #0080ff #0080ff #0080ff;
}
#iframe{
border-width : 0px 0px 0px 0px;
margin-left : 0px;
width : 573px;
height : 228px;
padding-top : 0px;
overflow : auto;
margin-top : 0px;
}

↓---iframe内に読み出してる先のテーブルに指定した内容(テーブル幅)---
#what{
width : 545px;
background-color : #ffffff;
margin-top : 0px;
}

A 回答 (1件)

示されたソースをそのままコピーしてみたところ、私の環境では表示されました。



関係ありませんが、スタイルシートに書かれている.nwesboxのスタイル、
>border-width : 1px 1px 1px 1px;border-style : solid solid solid solid;border-color : #0080ff #0080ff #0080ff #0080ff;
これは以下のように短く出来ます。
border: 1px solid #0080ff;

#iframeもborderを無くしたいのならborder:none;で出来ます。
marginやpaddingもmargin: 上 右 下 左;といったように短く記述することが出来ます。

参考URL:http://www.tohoho-web.com/css/index.htm
    • good
    • 0
この回答へのお礼

deco_o3uさまありがとうございました、
再度サーバーにデータをUPしてみましたが右側borderだけ
表示されません。
<div id="c">への設定がおかしいのでしょうか?
#c{
width : 289px;
float : left;
background-color : #ffffff;
margin-top : 30px;
margin-bottom : 0px;
padding-left : 7px;
}
よろしければ再度検証いただけましたら助かります。
またお礼の返事が遅くなりました事をお詫び申し上げます。

お礼日時:2009/11/26 15:22

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


おすすめ情報