#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    2
    Rep Power
    0

    Need css-edits help


    Hi,

    I have a website that has issues in firefox and IE. Our header keeps getting pushed to the right.

    URL= (not allowed to post, our domain is diabetessupplies4less)

    css-edit file:

    #ys_superbar { width: 100% !important }

    /**************************
    ********* VWD STYLES ******
    **************************/
    body {
    background: url(/lib/yhst-86191677430879/bkgnd.gif);
    }
    #bodycontent {
    float: none;
    width: 789px;
    padding: 0px 10px;
    text-align: left;
    }
    a {
    text-decoration:underline;
    }
    /**** SITE HTML ****/
    #top-banner {
    padding: 8px;
    background-color: $top-banner-bg;
    font-size: 16pt;
    border: 1px solid #114170;
    }
    #top-banner a {
    color: $top-banner-color;
    text-decoration: none;
    }
    #top-banner a:hover {
    color: #B71025;
    text-decoration: underline;
    }
    #site-html {
    border:1px solid #114170;
    width: 789px;
    background:white;
    }
    #contents .sale-price-bold {
    color:red;
    }
    .savings-pct {
    color:#FFB033;
    font-weight:bold;
    }
    #contents .name {
    font-weight: normal;
    }
    #contents .price {
    margin: auto;
    }
    .breadcrumbs {
    font-family:arial;
    margin:0 0 10px;
    }
    #contents .horizontal-seperator {
    vertical-align:bottom;
    }
    h1 {
    font-size: 14px;
    font-weight: bold;
    display: inline;
    }
    h2 {
    font-size: 11px;
    font-weight: bold;
    display: inline;
    }
    /**** HEADER ****/
    #site-header {
    padding-bottom:10px;
    }
    #header-table {
    }
    #header-top {
    background: #FFFFFF;
    }
    #header-header {
    line-height:0;
    }
    #logo {
    }
    #header {
    margin: auto;
    float: center;
    background: #FFFFFF;
    min-height:102px;
    width:840px;
    }
    .header-text {
    font-family:tahoma;
    font-size:22px;
    padding-top:10px;
    padding-right:0px;
    text-align:center;
    }
    #brandmark {
    width: auto;
    line-height: 0;
    margin: auto
    }
    #brandmark a {
    padding: 0px;
    }
    #top-search-div {
    float:left;
    }
    #searchsubmit {
    padding: 0px;
    }
    #searcharea {
    background:transparent;
    text-align:center;
    padding:0px 0px;
    }
    #searcharea fieldset {
    padding: 0px;
    }
    .labelfield span {
    color: #ffffff;
    font-size: 12px;
    }
    input#query {
    border:1px solid black;
    margin-left:0px;
    font-size:14px;
    height:15px;
    width:100px;
    }
    .buttonlabel {
    margin-left:7px;
    }
    #top-nav-div {
    float:left;
    padding-top:3px;
    }
    #top-nav-list {
    display:block;
    list-style:none;
    }
    #top-nav-list li {
    float:left;
    display:block;
    margin:0;
    }
    #top-nav-list li a {
    margin-right:30px;
    font-size:14px;
    text-decoration:none;
    color:#003366;
    font-weight:bold;
    font-family:Arial;
    }
    #top-nav-list li a:visited {
    color:#003366;
    }
    #top-nav-list li a:hover {
    color:#B71025;
    }
    #top-nav-cell{
    background:transparent url(/lib/yhst-86191677430879/top-nav.gif) repeat scroll 0 0;
    height:32px;
    padding:5px 10px 0;
    }
    /**** LEFT NAV ****/
    #site-left-nav {
    background-color: #ccd9e5;
    width: 150px;
    border-right:1px solid #a4b4c1;
    border-top:1px solid #a4b4c1;}
    input#searchsubmit {
    border:medium none;
    margin:0 0 0 5px;
    vertical-align:top;
    }
    #bottom-div {
    }
    #left-nav-table {
    }
    #left-nav img {
    display: block;
    }
    #below-left-nav {
    padding-bottom:30px;
    }
    .leftnav-button {
    margin:5px 0px;
    }
    .left-navigation {
    padding: 5px;
    text-align: left;
    }
    .left-navigation a {
    font-size:12px;
    text-decoration: none;
    color:#323234;
    }
    .leftnav-sub-buttons a {
    font-size:12px;
    padding-left: 10px;
    display: block;
    }
    #testimonial {
    padding:0px 5px;
    color:#323234;
    text-align:left;
    }
    /*** SWITCH ***/
    #site-switch {
    background-color: #FFFFFF;
    width: 560px;
    }
    #switch-table {
    }
    #messagetitle {
    text-align:left;
    margin:10px 0px 0px 0px;
    padding:0;
    }
    #maintype #contents {
    float: none;
    border: 1;
    }
    #maintype #caption {
    padding:0px;
    }
    #maintype #messagearea {
    margin:10px 0px;
    }
    #image1 {
    padding-right:10px;
    }
    #image2 {
    padding-bottom:8px;
    }
    #image3 {
    }
    #image4 {
    }
    #image5 {
    }
    #image6 {
    }
    #billboard li {
    margin:0;
    display:none;
    }
    /*** FOOTER ***/
    #site-footer {
    background:transparent;
    height: 68px;
    }
    #footer {
    background:#CCD9E5;
    border-top:1px solid #114170;
    }
    #copyright {
    text-align: left;
    padding: 10px 5px;
    color:#000000;
    }
    #copyright a {
    text-decoration: none;
    color:#000000;
    }
    #footer-links {
    padding: 13px 5px 0px;
    text-align: left;
    font-weight: normal;
    color:#000000;
    }
    #footer-links a {
    text-transform:none;
    color:#000000;
    }
    #secure-shopping {
    float:right;
    margin-right:10px;
    margin-top:10px;
    }
    /*** ITEM PAGE ***/
    #contentarea {
    width: 787px;
    margin:0;
    }
    #itemtype #caption {
    margin: 0 auto;
    }
    #contentarea #caption {
    margin: 10px 0px;
    }
    #itemtype .itemoption {
    font-weight: normal;
    }
    #item-contenttitle {
    display:none;
    }
    /*** ITEM TABLE ***/
    #itemtable {
    background-color:#ccd9e5;
    border: solid 1px #a4b4c1;
    text-align:left;
    }
    #itemtable td {
    padding:5px;
    }
    #itemtable-header {
    background:url(/lib/yhst-86191677430879/itemtable-header.gif) repeat-x;
    font-size:12px;
    font-weight:bold;
    height:34px;
    vertical-align:middle;
    color:#000000;
    }
    td#itemtable-header {
    padding:0 5px;
    }
    #itemtable-sku {
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-price {
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-sale-price {
    font-weight:bold;
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-you-save {
    font-weight:bold;
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-savings-pct {
    color:red;
    border-bottom:1px solid #a4b4c1;
    font-weight:bold;
    }
    .itemtable-options {
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-quantity {
    border-bottom:1px solid #a4b4c1;
    }
    #itemtable-delivery-date {
    }
    .addtocartImg {
    margin: auto;
    display:inline;
    padding:5px;
    }
    /*** SECTION PAGE ***/
    #section-contenttitle {
    padding: 0px;
    margin: 0 auto 0px;
    }
    /*** OTHER ***/

    #searchpageHeader {
    padding-left:0px;
    }

    #ys_cpers { display: inline; float:left; margin-left: 10px }



    Any help would be appreciated, I can't get it to work properly.

    thanks
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Dec 2003
    Posts
    708
    Rep Power
    441
    A table with floated elements inside it...interesting.

    Basically your header isn't clearing your top line because of the floated elements within it. You created a ys_clear element, but it doesn't seem to have any clearing styles associated with it.

    If it were me, I'd add overflow: hidden to #ys_superbar. That'll make it expand to close the floats, and push the header below.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    2
    Rep Power
    0

    thanks


    wow. you are the man.

IMN logo majestic logo threadwatch logo seochat tools logo