0

I have this page...http://thornwoodfinehomes.com/whatsNew.php and it looks good in Firefox and IE 7,8 & 9 but not in Safari and Google Chrome.

Here is the 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-->

And here is the 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;
}

I have no idea why its doing this in chrome and safari, any help would be appreciated. Thanks

1
  • .contentavailable { width: 560px; } and it's fixed Apr 14, 2012 at 22:31

1 Answer 1

1

I'm not sure how you're setting the widths, but it seems the left div contentAvailable is a little bit too big. When I resized it from 566px down to 500px, the right div rightContentAvailable slid up, and the layout looked normal. (This was in Chrome.)

Also, using the developer tools in Chrome is a good way to troubleshoot layout issues.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.