0

私はこのページを持っています... http://thornwoodfinehomes.com/whatsNew.php で、Firefox と IE 7、8 & 9 では見栄えがしますが、Safari と Google Chrome では見栄えがしません。

ここにHTMLがあります

<div class="contentAreaAvailable">
<div class="content">
<div class="contentText">
Some Text
<img src="pics/whatsNew1.jpg" width="407" height="247" border="0" />
</div><!--contentText-->

<div class="rightContent">
<img src="pics/whatsNew2.jpg" width="332" border="0" />
<br /><br />
<img src="pics/whatsNew3.jpg" width="332" border="0" />
</div><!--rightContent-->

</div><!--content-->
<div style="text-align:center; width:100%; float:left; padding-top:15px; font-size:26px;">
<stong><em>Coming soon, some exciting opportunities in Roseland Burlington.</em></stong>
</div>

</div><!--contentAreaAvailable-->

そしてここにCSSがあります

.contentAreaAvailable{
    background:#000;
    padding:50px;
    border:1px solid #FFF;
    width:912px;
    height:730px;
    float:left;
}

.content{
    padding-bottom:4px;
}

.contentAvailable{
    /*padding:20px 0 0 0;*/
    width:566px;
    font-size:22px;
    float:left;
    padding-bottom:10px;
    margin:10px 0 0 0;
}

.rightContentAvailable{
    float:right;
}

クロムとサファリでこれを行う理由がわかりません。助けていただければ幸いです。ありがとう

4

1 に答える 1

1

幅をどのように設定しているかはわかりませんが、左の div contentAvailableが少し大きすぎるようです。566px から 500px にサイズを変更すると、右側の div rightContentAvailableが上にスライドし、レイアウトが正常に見えました。(これはChromeでした。)

また、Chrome で開発者ツールを使用すると、レイアウトの問題をトラブルシューティングできます。

于 2012-04-14T22:30:11.347 に答える