Hmm...Don't know what the problem is.

[jessmolchan]

Hi Everyone!So I'm building a website and I'm testing it in all browsers as I go along. I own an iMac and a Windows laptop. On my iMac, the website looks perfect in Safari, Chrome and Firefox and in Opera the columns and content column don't show up. On my Windows, the website looks perfect in Chrome (apart from the @font-face cross-browser solution that was supposed to work not working) but it does the same thing in IE that it did in Opera: the columns and content column don't show up (although the @font-face solution works...)I don't quite understand what could be causing this problem. I'm hoping someone will have an insight into why this is happening. I've put the css file below, please let me know if you need anything else. ~Jess

/* ------ Section 1 - Global Body, Font and Link Settings ------ */body {background-color: #ffb652;background-image: none;background-position: top left;background-repeat: no-repeat;margin: 0;padding: 0;font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;color: #52555A;font-size: 85%;}h1, h2, h3, h4, h5, h6 {background-color: transparent;color: #d13c94;clear: both;}h2, h3, h4, h5, h6 {margin-top: 24px;}h1 {font-family: 'Little Bliss Bold';margin-top: 0;font-size: 500%;text-align: right;}h2 {border-bottom: 1px solid #d13c94;}h3 {border-bottom: 1px solid #d13c94;}blockquote {margin: 12px 56px;color: #d13c94;font-size: 100%;line-height: 20px;font-family: 'Lucida Fax', 'Georgia', serif;font-style: italic;}code {color: navy;}img {border: 0;}a:link img {border: 0;padding: 10px;}/* -- General Link Styling -- */a {color: #d13c94;text-decoration: underline;}a:visited {color: #d13c94;text-decoration: underline;}a:hover {color: #d13c94;text-decoration: underline;}@font-face {font-family: 'Little Bliss Bold';src: url('little_bliss_bold-webfont.eot');src: local(☺'),url('little_bliss_bold-webfont.woff') format('woff'),url('little_bliss_bold-webfont.ttf') format('truetype'),url('little_bliss_bold-webfont.svg#webfont') format('svg');font-weight: normal;font-style: normal;}@font-face {font-family: 'Throw My Hands Up in the Air';src: url(throw_my_hands_up_in_the_air-webfont.eot);src: local(☺'),url('throw_my_hands_up_in_the_air-webfont.woff') format('woff'),url('throw_my_hands_up_in_the_air-webfont.ttf') format('truetype'),url('throw_my_hands_up_in_the_air-webfont.svg#webfont') format('svg');font-weight: normal;font-style: normal;}/* ------ Section 2 - Global Page Structure ------- */#PageWrapper {width: 1024px;border: 0;margin: 0 auto;background-image: url(jersey.jpg);background-repeat: no-repeat;background-color: #FFB652;}#Header {background-color: transparent;position: relative;height: 256px;}/* ----- column fixbackground-image: url(column-fix1.png);background-repeat: repeat-y;----- */#ContentWrapper {float: left;width: 100%;}#ContentColumn {width: 598px;position: relative;right: -46px;background-color: white;margin: 0 190px;margin-top: 0;min-height: 1020px;}#NavColumn {float: left;background-color: #aae6ff;position: relative;right: -63px;width: 173px;             margin-left: -1024px;margin-top: 0px;padding-bottom: 20px;opacity: .86;font-size: 90%;color: #d13c94;min-height: 1000px;}#ExtraColumn {float: left;position: relative;left: -10px;width: 135px;               margin-left: -180px;padding-bottom: 20px;background-repeat: repeat-y;background-color: #aae6ff;opacity: .86;font-size: 90%;color: #d13c94;min-height: 1000px;}#Footer {clear: both;position: relative;right: -1px;width: 1024px;padding: 0;margin-top: 0;background-color: transparent;padding: 60px 0 10px 0;text-align: center;font-size: 85%;min-height: 100%;}#imgmap{margin: none;padding: none;}.Liner {padding: 10px;}#Header .Liner {padding: 0;}#Footer .Liner {margin: 0;padding: 0;}html>body #Footer {       /* for IE6 comptibility. Above is coded for IE6, but every other browser will read this section to supercede that code. */padding: 40px 0 0 0;}#NavColumn h4 {font-family: 'Throw My Hands Up in the Air';font-size: 150%;color: #d13c94;margin-top: 0;}#ExtraColumn h4 {font-family: 'Throw My Hands Up in the Air';font-size: 150%;color: #d13c94;margin-top: 0;}/* ------ Section 4 - Left Column Navigation ------ */.Navigation {width: 100%;font-family: 'Throw My Hands Up in the Air', 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;font-size: 140%;background-color: transparent;display: block;}/* -- Nav Headers -- */.Navigation h3 {font-family: 'Throw My Hands Up in the Air';padding: 0;font-size: 110%;color: #d13c94;margin: 8px 0;}/* -- Nav List -- */.Navigation ul {list-style-type: none;padding: 0 0 8px 0px;margin: -6px -10px 0 0;}.Navigation li {border: 0px solid;color: #d13c94;margin-bottom: -12px;}html>body .Navigation li {        /* for IE6 compatibility. Above is coded for IE6, but every other browser will read this section to supercede that code. */margin-bottom: 5px;}/* -- Navigation Link styles -- */.Navigation a {color: #d13c94;display: block;padding: 3px 0 3px 5px;background-color: #c9d929;text-decoration: none;}.Navigation a:visited {color: #808080;background-color: #c9d929;display: block;padding: 3px 0 3px 5px;text-decoration: none;}.Navigation a:hover {color: #E57917;display: block;    padding: 3px 0 3px 6px;background-color: white;   text-decoration: none;}/* ------ Section 5 - Additional Navigation ------ *//* -- Thumbnail-with-Caption Navigation -- */.ThumbnailLink {text-align: center;}.ThumbnailLink a {text-decoration: none;}.ThumbnailLink a:hover .Caption {text-decoration: underline;color: #930;     /* chocolate color for link color of captions */}#Footer a {color: #d13c94;}#Footer a:hover {color: white;}/* -- Horizontal Text NavBar -- */.ExtraNav {font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;border: 0 solid;padding: 0 0 5px 0;background-image: url(extra-nav-background.gif);background-position: bottom left;background-repeat: no-repeat;background-color: transparent;}.ExtraNav ul {list-style-type: none;padding: 0 10px;}.ExtraNav ul li {display: inline;margin-left: 10px;background-color: transparent;text-align: center;}.ExtraNav a {color: #FCE6B1;    /* cream color for links */text-decoration: none;text-align: center;}.ExtraNav a:visited {color: #FCE6B1;    /* cream color for visited links */text-decoration: none;}.ExtraNav a:hover {color: white;text-decoration: underline;}#Footer .ExtraNav {background-image: url();margin: 20px auto;background-color: transparent;}/* ------ Section 6 - Boxes ------ */.CalloutBox {background-image: none;background-color: white;width: 85%;border: 1px solid #d13c94;padding: 4px;color: #d13c94;font-size: 100%;line-height: 20px;font-family: 'Lucida Fax', 'Georgia', serif;font-style: italic;margin:18px auto 24px auto;}div.CalloutBox p {margin: 20px 33px 13px 33px;text-indent: 10px;}p.CalloutBox {padding: 20px 33px 13px 33px;text-indent: 10px;}div.CalloutBox h1,div.CalloutBox h2,div.CalloutBox h3,div.CalloutBox h4,div.CalloutBox h5,div.CalloutBox h6 {font-style: normal;margin: 33px 13px 13px 13px;text-align: left;}.ReminderBox {          background-color: #white;width: 24%;border: 0;margin: 0 0 12px 18px;float: right;color: #d13c94;}.ReminderBox h4 {margin: 0;padding: 4px;text-align: center;background-color: #b6dfe7;font-family: 'Lucida Fax', serif;font-style: italic;color: #d13c94;}.ReminderBox p {font-size: 80%;padding: 8px;margin-top: 0;line-height: 120%;}html>body .ReminderBox p {     /* for IE6 comptibility. Above is coded for IE6, but every other browser will read this section to supercede that code. */padding: 8px 8px 0 8px;margin-top: 0;}/* ------ Section 7 - Frequently Used Styles ------ */.Clear {clear: both;}.Caption {display: block;padding: 2px 0;background-color: white;color: #898935;       /* drab green font color */font-size: 8pt;font-weight: normal;line-height: 150%;margin-bottom: 10px;}/* -- floats -- */.ItemRight {float: right;margin: 2px 0 12px 18px;text-align: center;}.ItemCenter {margin: 2px auto 12px auto;text-align: center;clear: both;}.ItemLeft {float: left;margin: 2px 18px 12px 0;text-align: center;}

[thescientist]

would help to have the HTML. link would be best.

[jessmolchan]

would help to have the HTML. link would be best.

http://jerseycookiegirl.comhere's the html for the homepage:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd"><html><head>  <title>Jersey Cookie Girl - Custom Cookies for All Occasions</title>  <meta name="Description" content="short description of your page goes here">  <meta name="Keywords" content="comma separated keywords go here. 3 to 5 keywords are sufficient">  <link href="style.css" rel="stylesheet" type="text/css"><link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <script type="text/javascript" src="js/prototype.js"></script><script type="text/javascript" src="js/scriptaculous.js?load=effects"></script><script type="text/javascript" src="js/lightbox.js"></script><link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /></head><body>  <div id="PageWrapper">    <div id="Header"><img src="header-image3.png" usemap="#header_map" style="margin:0px"/ ><map name="header_map"><area shape="rect" coords="14,14,803,167" href="http://www.jerseycookiegirl.com"></map>      <div class="Liner">      </div><!-- end Liner -->    </div><!-- end Header -->    <div id="ContentWrapper">      <div id="ContentColumn">        <div class="Liner">          <h1>Welcome!</h1><a href="pics/flowers_16_1.jpg" rel="lightbox"><img align="left"src="pics/flowers_16.jpg" width="220" height="217" alt=“Spring is Here!”title="Spring is Here!"></a>          <p>Jersey Cookie Girl.com is currently under construction!</p><p>We have many new features in the works, including an online order form.</p><p>While we're making changes, we suggest you <a href="http://www.facebook.com/JerseyCookieGirl?ref=ts" target="_blank">visit our Facebook page</a>.</p>                        </div><!-- end Liner -->      </div><!-- end ContentColumn -->    </div><!-- end ContentWrapper -->    <div id="NavColumn">      <div class="Liner">    <h4>Many new features coming soon!</h4>           </div><!-- end Liner -->    </div><!-- end NavColumn -->    <div id="ExtraColumn">      <div class="Liner"><h4>Check back with us soon!</h4>          </div><!-- end Liner-->    </div><!-- end ExtraColumn -->    <div id="Footer"><div="imgmap"><img src="footerb.jpg" usemap="#footer_map" style="margin:0px"/ ><map name="footer_map"><area shape="rect" coords="597,175,901,210" href="http://www.jmandmdesign.blogspot.com" target="_blank"></map></div>      <div class="Liner">      </div><!-- end Liner -->    </div><!-- end Footer -->  </div><!-- end PageWrapper --></body></html>