3 Replies Latest reply on May 14, 2015 12:02 PM by David_Powers

    mainnav has space on left side but I can't find anything in the stylesheet that might be causing that

    adraper7 Level 1

      I have followed the tutorial and the only thing that doesn't look correct is the mainnav.  It has a space to the left.  I have reviewed the main.css and can't find anything that might be causing that.  I am using a trial version of Dreamweaver CC 2014.1.1 Release 6981 Build.

       

      mainnav-space.png

       

       

      Here is my main.css

       

      @charset "utf-8";

      body {

          margin: 0px;

          color: #151515;

          font-family: source-sans-pro;

          background-color: #EFF5F8;

          font-style: normal;

          font-weight: 400;

      }

      #wrapper {

          width: 100%;

          min-width: 740px;

          max-width: 1000px;

          margin-left: auto;

          margin-right: auto;

          background-color: #FFFFFF;

      }

      #top {

          overflow: hidden;

      }

      #hero img {

          max-width: 100%;

      }

      h1, h2 {

          color: #3399CC;

          font-family: source-sans-pro;

          font-style: normal;

          font-weight: 600;

      }

      h1 {

          font-size: 72px;

          margin-top: 0px;

          margin-bottom: 0px;

          text-align: center;

          text-transform: uppercase;

      }

      h2 {

          margin-top: 0.5em;

      }

      #main {

          width: 58%;

          margin-left: 2%;

          float: left;

      }

      #sidebar {

          width: 34%;

          margin-left: 4%;

          float: left;

      }

      figure {

          display: block;

          width: 420px;

      }

      figure img {

          padding: 10px;

          -webkit-box-shadow: 1px 1px 15px #999999;

          box-shadow: 1px 1px 15px #999999;

      }

       

      figcaption {

          font-size: 0.875em;

          font-weight: bold;

          text-align: center;

          display: block;

          margin-top: 0.5em;

      }

      .centered {

          margin-left: auto;

          margin-right: auto;

      }

      .floatleft {

          float: left;

          margin-left: 0px;

          margin-right: 10px;

      }

      .floatright {

          float: right;

          margin-left: 10px;

          margin-right: 0px;

      }

      footer {

          padding-top: 2px;

          padding-bottom: 2px;

          padding-left: 2%;

          background-color: #43a6cb;

          color: #FFFFFF;

          clear: left;

      }

      a {

          font-weight: bold;

          text-decoration: none;

      }

      a:link {

          color: #FF6600;

      }

      a:visited {

          color: #FF944C;

       

      }

      a:hover, a:active, a:focus {

          color: #7F3300;

          text-decoration: underline;

      }

      #mainnav ul {

          list-style-type: none;

          margin-top: 0px;

          margin-left: 0px;

      }

       

      #mainnav a {

          width: 20%;

          display: block;

          text-transform: uppercase;

          color: #ffffff;

          padding-top: 6px;

          padding-bottom: 6px;

          background-color: #4D4D4D;

          float: left;

          text-align: center;

      }

      #mainnav a:hover, #mainnav a:active, #mainnav a:focus, #mainnav .thispage {

          background-color: #43A6CB;

          text-decoration: none;

      }