2 Replies Latest reply on Apr 18, 2010 7:04 AM by Ken Binney-GnPIX3

    link to css error

    Crispy Chris Level 1

      <link href="rescueRegister.css" rel="stylesheet" type="text/css" />

       

      Check browser compatibility in DW CS4 on mac returned the following but did not suggest solution. Anyone have a suggestion?

       

      Found 4 errors in rescueRegister.css

      Affects: Internet Explorer 6.0, 7.0; Internet Explorer for Macintosh 5.2; Opera 8.0, 9.0; Safari 2.0

       

      Here is the css

       

      @charset "UTF-8";

      body  {

      padding: 0;

      text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */

      color: #000000;

      font-family: Verdana, Arial, Helvetica, sans-serif;

      font-size: 100%;

      background-color: #000;

      margin-top: 0px;

      margin-right: 0px;

      margin-bottom: 0px;

      margin-left: 0px;

      }

      .thrColFixHdr #container {

      width: 1024px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */

      background: #FFFFFF; /* the auto margins (in conjunction with a width) center the page */

      border: 1px solid #000000;

      text-align: left; /* this overrides the text-align: center on the body element. */

      margin-top: 0;

      margin-right: auto;

      margin-bottom: 0;

      margin-left: auto;

      height: 825px;

      }

      .thrColFixHdr #header {

      background-color: #DDDDDD;

      background-image: url(images/rescuehead.jpg);

      height: 200px;

      padding-top: 0;

      padding-right: 10px;

      padding-bottom: 10;

      padding-left: 20px;

      margin: 0px;

      }

      .thrColFixHdr #sidebar1 {

      float: left; /* since this element is floated, a width must be given */

      width: 205px; /* padding keeps the content of the div away from the edges */

      padding-top: 25px;

      padding-right: 0px;

      padding-bottom: 15px;

      padding-left: 0px;

      height: 500px;

      background-color: #F9F4EF;

      }.smallprint {

      font-size: 10px;

      color: #444;

      }

      CSS

      #navcontainer

      {

      background: #f0e7d7;

      width: 205px;

      font-family: georgia, serif;

      font-size: 13px;

      text-align: center;

      text-transform: lowercase;

      margin-top: 0;

      margin-right: 0px;

      margin-bottom: 0;

      margin-left: 0px;

      padding-top: 1em;

      padding-right: 0;

      padding-bottom: 1em;

      padding-left: 0;

      }

       

      ul#navlist

      {

      text-align: left;

      list-style: none;

      padding: 0;

      width: 205px;

      margin-top: 0;

      margin-right: 0px;

      margin-bottom: 0;

      margin-left: 0px;

      }

       

      ul#navlist li

      {

      display: block;

      margin: 0;

      padding: 0;

      }

       

      ul#navlist li a

      {

      display: block;

      width: 100%;

      padding: 0.5em 0 0.5em 2em;

      border-width: 1px;

      border-color: #ffe #aaab9c #ccc #fff;

      border-style: solid;

      color: #555;

      text-decoration: none;

      background: #f7f2ea;

      }

       

      #navcontainer>ul#navlist li a { width: auto; }

       

      ul#navlist li#active a

      {

      background: #f0e7d7;

      color: #800000;

      }

       

      ul#navlist li a:hover, ul#navlist li#active a:hover

      {

      color: #800000;

      background: transparent;

      border-color: #aaab9c #fff #fff #ccc;

      }

      .thrColFixHdr #mainContent {

      margin-top: 0;

      margin-right: 55px;

      margin-bottom: 0;

      margin-left: 220px;

      padding-top: 0;

      padding-right: 10px;

      padding-bottom: 0;

      padding-left: 10px;

      }

      .thrColFixHdr #footer {

      padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */

      background:#DDDDDD;

      }

      .thrColFixHdr #footer p {

      margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */

      padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */

      font-size: 11px;

      }

      .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */

      float: right;

      margin-left: 8px;

      }

      .fltlft { /* this class can be used to float an element left in your page */

      float: left;

      margin-right: 8px;

      }

      h2 {

      font-size: 18px;

      }

      a:link {

      color: #022A4E;

      text-decoration: none;

      }

      a:visited {

      text-decoration: none;

      color: #5D1A0F;

      }

      a:hover {

      text-decoration: none;

      }

      a:active {

      text-decoration: none;

      }

      h1 {

      font-size: 24px;

      line-height: normal;

      font-style: normal;

      text-align: left;

      padding: 0px;

      margin-top: 21px;

      margin-right: 0px;

      margin-bottom: 0px;

      margin-left: 0px;

      }

      #mainContent p small print {

      font-size: 12px;

      color: #777;

      }

      #mainContent p small print {

      font-size: 10px;

      color: #444;

      }

       

        • 1. Re: link to css error
          Ben M Adobe Community Professional

          I found 2 errors with your CSS.  First, the body background-color and color are the same (black #000).  Black on black will make things not visible.  Second, your .thrColFixHdr #header padding-bottom is set to 10.  You have to add px after the 10 for the code to be valid, otherwise the browser does not know what the units should be.

           

          As far as Browser Compatibility checks go, open up that window and click the Play button (I call it that, little green arrow for running check) and choose settings.  Uncheck IE for Mac, set IE to 7.0, Safari to 3.0, Firefox to 2.0.  Unless you have statistics for your site proving otherwise, this would tend to be a good place to start the DW browser check.  IE for Mac support was dropped back at 10.3, IE has dropped support for IE 6 (but if you have statistics proving other keep it), Safari 3 was released with Leopard and as of February 80% of Mac users were on either Leopard or Snow Leopard ( http://www.appleinsider.com/articles/10/02/27/mac_os_x_market_share_up_29_leopard_still_mo st_common.html ) and Firefox 2.0 was released in 2006.  In all honesty Firefox could be bumped up to 3.0 because those users tend to upgrade as well.

          • 2. Re: link to css error
            Ken Binney-GnPIX3 Level 4

            I think you need a unit (like px )after the 10 value

             

            thrColFixHdr #header {

            background-color: #DDDDDD;

            background-image: url(images/rescuehead.jpg);

            height: 200px;

            padding-top: 0;

            padding-right: 10px;

            padding-bottom: 10;

            padding-left: 20px;

            margin: 0px;

            }