Tiny bit of CSS help please...

Discussion in 'CSS' started by RDarby, Jun 18, 2013.

0
  1. #1
    Hi everyone,

    I am trying to create a cleaner sub menu system for my site. I have one at the moment but it isnt quite right.

    If anyone could help me I would be grateful, my site is www(dot)fastfoodforum.co.uk and if you hover the mouse over the "forums" option on the top menu, you will see a sub menu appear, I was wondering if anyone could help me remove the small gaps between each block and possibly explain how i can stop the other content from jumping when it I hover over "forums".

    Thank you very much DP members....

    F.Y.I when i say small gaps between each block, I mean the gaps between each sub menu item that look kind of un-professional
     
    Last edited by a moderator: Apr 1, 2014
    RDarby, Jun 18, 2013 IP
  2. essadik34

    essadik34 Active Member

    Messages:
    67
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    61
    #2
    Hi, please try this :

    Change position on #access ul ul to absolute and top to 30px :

    #access ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    display: block;
    left: 0;
    position: absolute;
    top: 30px;
    width: 80px;
    z-index: 99999;
    }

    And add position relative to #access .menu-header li, div.menu li :


    #access .menu-header li, div.menu li {
    float: left;
    margin: 0;
    padding: 9px 17px 0 0;
    position: relative;
    }

    And about space between menu try this :

    #access ul ul li {

    padding-top : 0px;

    }
     
    essadik34, Jun 18, 2013 IP
  3. RDarby

    RDarby Active Member

    Messages:
    79
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    68
    Digital Goods:
    1
    #3
    well thanks a lot for the suggestion, but it didn't quite do the trick, this has stumped me for quite some time!
     
    RDarby, Jun 18, 2013 IP