Works in Firefox not in Chrome/Safari

[waelaltaqi]

I put togather this website: http://www.theriverviewinn.com

The site is built with Joomla. The home page consists of two tables. The two tables align vertically in IE/Firefox but they align vertically in chrome/safari ... I tried many times but no luck ... here is the HTML code for the home page:

<h3><font face="book antiqua,palatino">Home</font>  </h3>
<table cellspacing="5" cellpadding="5" width="900">
<tr>
<iframe align="left" src="http://www.theriverviewinn.com/rvstie/images/FrontPageSlide/slide.html" width="730" height="490">
 <p>Your browser does not support iframes.</p>
</iframe> 
</tr>

 <tr>
  <td>
   <p>
    <font face="book antiqua" size="3"> We offer a variety of amenities designed to exceed your expectations, including:</font>
   </p>
  </td>
 </tr>

</table>

<table cellspacing="5" cellpadding="5" width="700">
<tr>
  <td><p><font face="book antiqua" size="3">
    • Complimentary breakfast <br />
• McKenzie’s Lounge <br />
• Indoor heated pool & deck <br />  overlooking the Cumberland River <br />
</font></p>

 </td>
   <td><p><font face="book antiqua" size="3">
     • Free high-speed wireless internet <br />
     • Complimentary USA Today <br />
     • Business center <br />
     • Fitness Center <br />
     • Meeting  space & banquet facilities <br /></font></p>
   </td>  
</tr>
</table>

Any hints???? Could be a problem with the Joomla CSS?

[silviubogan]

try putting a <br /> between the tables.

[waelaltaqi]

try putting a <br /> between the tables.

didn't work

[MidiMagic]

"The two tables align vertically in IE/Firefox but they align vertically in chrome/safari "

What's the difference? Vertical is vertical.

[waelaltaqi]

sorry.... i meant to say that the tables in Firefox/IE line up horizontally while in chrome/safari they line up vertically

[MidiMagic]

The tables will realign vertically if they will not fit in the space available horizontally. The one intended to be on the right of the page will drop under the one on the left.

Note that different browsers and screen resolutions will make things fit or fail to fit differently.

If you want things to always fit, use percentages for width, and leave some extra space.

[MidiMagic]

I found some errors.

You can not put ANYTHING immediately inside a tr tag pair except a td tag pair or a th tag pair. You have an iframe tag pair there. You can't do that. This drops the browser into quirks mode.

There are only a few tags you can put directly inside a table tag pair too, and they are all related to tables. Other tags must be either outside the table tag pair, or inside a td pair or a th pair.

You have unescaped ampersands. They are causing the browser to lose its place, and making it drop into quirks mode.

You need to check your code for validity at the W3C.