I have a problem with drop down menu, it goes below content and I am not shure hot to keep it always on top


#meniict,#meniict ul {
    list-style: none outside none;
    margin: 0;
    padding: 0;
#meniict {
    background: url('menu_bg.png') no-repeat scroll 0 0 transparent;
    clear: both;
    font-size: 12px;
    height: 58px;
    padding: 0 0 0 9px;
    position: relative;
    width: 941px;

#meniict ul {
    background-color: #222;
    border:1px solid #222;
    border-radius: 0 5px 5px 5px;
    border-width: 0 1px 1px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5);
    left: -9999px;
    overflow: hidden;
    position: absolute;
    top: -9999px;
    z-index: 5;

    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    -webkit-transform: scaleY(0);
    transform: scaleY(0);

    /*-moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

    -moz-transition: -moz-transform 0.1s linear;
    -ms-transition: -ms-transform 0.1s linear;
    -o-transition: -o-transform 0.1s linear;
    -webkit-transition: -webkit-transform 0.1s linear;
    transition: transform 0.1s linear;*/
#meniict li {
    background: url('menu_line.png') no-repeat scroll right 5px transparent;
    float: left;
    position: relative;
#meniict li a {
    color: #FFFFFF;
    display: block;
    float: left;
    font-weight: normal;
    height: 30px;
    padding: 23px 20px 0;
    position: relative;
    text-decoration: none;
    text-shadow: 1px 1px 1px #000000;
#meniict li:hover > a {
    color: #00B4FF;
#meniict li:hover, #meniict a:focus, #meniict a:hover, #meniict a:active {
    background: none repeat scroll 0 0 #121212;
    outline: 0 none;
#meniict li:hover ul.subs {
    left: 0;
    top: 53px;
    width: 180px;

    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
#meniict ul li {
    background: none;
    width: 100%;
#meniict ul li a {
    float: none;
#meniict ul li:hover > a {
    background-color: #121212;
    color: #00B4FF;
#lavalamp {

    height: 16px;
    left: 13px;
    position: absolute;
    top: 0px;
    width: 64px; 

    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
#lavalamp:hover {
    -moz-transition-duration: 3000s;
    -ms-transition-duration: 3000s;
    -o-transition-duration: 3000s;
    -webkit-transition-duration: 3000s;
    transition-duration: 3000s;

#meniict li:nth-of-type(1):hover ~ #lavalamp {
    left: 13px;
#meniict li:nth-of-type(2):hover ~ #lavalamp {
    left: 90px;
#meniict li:nth-of-type(3):hover ~ #lavalamp {
    left: 170px;
#meniict li:nth-of-type(4):hover ~ #lavalamp {
    left: 250px;
#meniict li:nth-of-type(5):hover ~ #lavalamp {
    left: 330px;
#meniict li:nth-of-type(6):hover ~ #lavalamp {
    left: 410px;
#meniict li:nth-of-type(7):hover ~ #lavalamp {
    left: 490px;
#meniict li:nth-of-type(8):hover ~ #lavalamp {
    left: 565px;

I also have other stylesheet for css, can you help me to show this?

Its not enough just to see this piece of CSS you provided. Do you have this site online so we can take a look at the source code and behavior that you are referring to?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, learning, and sharing knowledge.