still not working correctly. Options

[pensivegnome]

I read the tutorial on how to make it firefox compatiable & I tried doing that on different parts of the code & it still isn't being displayed right on firefox. Could someone please check & see what I'm doing wrong. Thanks!

<!-- begin code provided by createblog.com --><br />GLOBAL_HEAD<=<br /><style type="text/css"><br /><!--<br />body, td, font, div, p { <br />font-family: "terminal", "terminal", "terminal", terminal;<br />font-family: "terminal", "terminal", "terminal", terminal;!important<br />font-size: 8pt;<br />font-size: 8pt;!important <br />} <br />body {<br />background-color: #77C5AB;<br />background-image: url(http://img.photobucket.com/albums/v456/brokensmile092/Livejournal%20Stuff/Iboom.gif);<br />background-repeat: repeat;<br />background-attachment: fixed;<br />background-position: top left;<br />}<br />div {<br />background-image: url(http://img.photobucket.com/albums/v456/brokensmile092/LJ%20Banners/cars1.jpg);<br />background-repeat: no-repeat;<br />background-position: top center;<br />padding-top: 330;<br />text-align: center;<br />text-align: center;!important<br />}<br />.shadowed img{<br />visibility:hidden;position:absolute;top:0<br />}<br />div div { <br />background: none; width: auto; height: auto; padding: 2; <br />}<br />div table {<br />div-align: center;<br />width: 451;<br />}<br />table { <br />width: 60%; <br />margin-left: 0%; <br />margin-right: 0%; <br />margin-top: 0%<br />margin-bottom: 0%<br />} <br />table table { <br />width: 100%; <br />margin:0; <br />margin:0;!important<br />} <br />table table table { <br />width: auto; <br />} <br />table {<br />border: 2px dashed  black;<br />} <br />table table { <br />border: 0px  black;<br />}<br />scrollbar-base-color: #77C5AB;<br />scrollbar-track-color: #77C5AB;<br />scrollbar-face-color: #77C5AB;<br />scrollbar-highlight-color: #000000;<br />scrollbar-3dlight-color: #000000;<br />scrollbar-darkshadow-color: #000000;<br />scrollbar-shadow-color: #000000;<br />scrollbar-arrow-color: #000000;<br />} <br />a:hover {<br />color: #77C5AB;<br />font-weight: bold;<br />text-decoration: underline;<br />height: 0;<br />}<br />.blogbody b, .standard b, p b, strong {<br />/* edits bolded text in your entry */<br /> font-weight: bold;<br /> font-color: #77C5AB;<br /> }--><br /></style><br /><=GLOBAL_HEAD<br /><br /><br /><!-- end code provided by createblog.com -->

[*Libertie*]

<!-- begin code provided by createblog.com --><br />table { <br />width: 60%; <br />margin-left: 0%; <br />margin-right: 0%; <br />margin-top: 0%<br />margin-bottom: 0%<br />} <br /><!-- end code provided by createblog.com -->

This is your problem. Firefox sees align-left: 0%, and it does just that. Yes, left and right should be equal so that it stays in the center, but the percentages should add up to 100% so it doesn't confuse the browser.

Since the width of your image is 60%, the left and right margins should both be 20%.

And a tip - if you ever work with top margins (this doesn't apply here), you should never use percentages. Always use pixel values, because usually you use a top margin because of a header image. If you use percentages, it will either cover the picture up or be too far down in different resolutions. And you should never need a bottom margin.