- 締切済み
firefoxで
会社のHPをHPビルダーで作成しています、 <div class="content">要素の中に２つのBOX「左配置<div class="text09">・右配置<div class="text10">」を作成して左右に並べてみたのですがIE6,7,8では希望通り表示されるのですがfirefoxでは左text09のBOX下にtext10が配置されてしまいます、CSS初心者ですが右配置text10のwidth幅を指定しなければfirefixでも左右ならんで表示されるのですが、右配置text10の記字が左text09の下側に廻り込んでしまうのです？ どうしたら良いでしょうか？どなたかご指導いただけませんでしょうか、宜しくお願いします。 ※サイドメニューの右側にcontentを配置 ※<?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" xml:lang="ja" lang="ja"> ＜ソース記述＞ <div class="content"> <div class="text09"> <img src="img/industria01.jpg" width="331" height="272" alt="工業団地" title="工業団地" /><br /> Partnershipの工業団地</div> <div class="text10"><a href="01.html"><img src="img/industria02.jpg" width="220" height="142" alt="（写真をクリックすると拡大できます）" title="（写真をクリックすると拡大できます）" /></a><br /> Texas A&M Park<br /> （写真をクリックすると拡大できます）<br /> <a href="02.html"><img src="img/industria04.jpg" width="220" height="88" alt="（写真をクリックすると拡大できます）" title="（写真をクリックすると拡大できます）" /></a><br /> Business Park<br /> （写真をクリックすると拡大できます） </div> </div> 以下CSS記述 .content{ background-color : #ffffff; margin-left : 0px; margin-bottom : 0px; padding-left : 0px; width : 682px; float : right; padding-top : 0px; padding-right : 0px; } .text09{ float : left; font-size : 13px; font-family: Arial,"ＭＳ Ｐゴシック","MS UI Gothic",Osaka,Sans-Serif; line-height : 1.6; color : #000000; padding-left : 0px; margin-left : 50px; margin-right : 20px; width : 331px; display:inline; } .text09 a img{border-width : 0px 0px 0px 0px; } .text10{ font-size : 13px; font-family: Arial,"ＭＳ Ｐゴシック","MS UI Gothic",Osaka,Sans-Serif; line-height : 1.6; color : #000000; margin-left : 15px; width : 220px; } .text10 a img{border-width : 0px 0px 0px 0px;} この質問内容で解りますでしょうか？
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- SAYKA
- ベストアンサー率34% (944/2776)
ソースを詳しく見てないけど IEとfirefoxでは marginとpadding、それとそれらに関わるborderの処理の仕方が違うからそこをまず確認する事になるよ。 ありがちなのが 外側が 800pxとかにしてて 中は400pxと400pxなんだけど って場合で これにborderを付けるとIEとfirefoxで描画の基準が違うために表示が変る。 具体的にはfirefoxではborderはwidth:400pxとは別に幅を取られるので足りなくなってずれる ってお話だね。 そうなっていないかをまず確かめてみて。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_2_thumbnail_img_sm.png)
