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

    Join Date
    Sep 2003
    Posts
    50
    Rep Power
    11

    Question css transparency and layer sequence problems


    Hi There,
    I am building a site using CSS and am running into two problems:
    here is the URL: www.kohlrbaby.com/kohlrnew/demo.htm

    1)In my main nav bar i'm using dropdowns on the catalogue tab. However, when it drops down it is transparent and shows the stuff under it. I have changed the background-color to white and it is still coming up as transparent! Any ideas on another command I should be using?

    I have included applicable portion of css file at bottom of this.

    2) the layer order is not correct as the drop down is going behind the photo, i'm also not sure how to fix this. Any suggestions would be welcome!!!

    Thanks
    Jill

    Applicable css code to problem 1):

    #mainMenu {

    text-align: center;
    color: #000;
    margin: 0px;
    padding: 0px 0px 0px 0px;
    }

    #menuList {
    margin: 0px;
    padding: 0px;
    }

    #menuList ul {
    margin: 0px;
    padding: 0px;
    }

    #menuList li {
    display: inline;
    list-style: none;
    }

    a.actuator {
    background-color: transparent;
    color: #000;
    font-size: 9px;
    margin: 0px;
    padding: 0px 0px;
    text-decoration: none;
    }

    a.actuator:hover {

    color: #958550;
    }

    .menu {
    color: #000;
    background-color: #FFFFFF;
    border: 1px solid #CCC;
    position: absolute;
    visibility: hidden;
    }

    .menu li a {
    background-color: #ffffff;
    color: #000;
    display: block;
    font-size: 9px;
    line-height: 1.75em;
    margin: 0px;
    padding: 0px 10px;
    text-decoration: none;
    }

    .menu li a:hover {
    background-color: #7C8895;
    color: #EEE;
    }

    span.key {
    text-decoration: underline;
    }

    #homeMenu { width: 100px; }
    #catalogueMenu { width: 100px; }
    #wholesaleMenu { width: 100px; }
    #wheretobuyMenu { width: 100px; }
    #contactMenu { width: 100px; }
  2. #2
  3. |<.+#f@#+.&.|
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2002
    Location
    norway
    Posts
    3,009
    Rep Power
    1224
    adding a z-index to .menu fixed it in mozilla.

    .menu {
    z-index:1;
    }
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Posts
    50
    Rep Power
    11
    Thanks for that! It is currently working in Netscape and Mozilla, however, it is still misbehaving in IE......
    Last edited by sileebailey; November 10th, 2003 at 09:05 PM.
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Posts
    50
    Rep Power
    11
    it seems I"m having problems with IE only......PLEASE PLEASE does anybody have any tricks to fix this?

    Thanks
    Last edited by sileebailey; November 14th, 2003 at 02:41 AM.

IMN logo majestic logo threadwatch logo seochat tools logo