Need help with CSS

Discussion in 'HTML & Website Design' started by Access, Mar 10, 2008.

  1. #1
    I have a drop down menu(see attached). When you do mouse over the menu shows up aligned to the left(marked in red in the attached image). My question is how to align it to the right?

    Thank you


    menu.jpg
     
    Access, Mar 10, 2008 IP
  2. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Could you post the CSS for the menu then i can help identify how to help you, someone else might be able to do it without this but i'd need to see the code.
     
    wd_2k6, Mar 10, 2008 IP
  3. Access

    Access Member

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #3
    This is it, Thanks

    #sddm
    { margin: 0;
    padding: 0;
    z-index: 30}

    #sddm li
    { margin: 0;
    padding: 0;
    list-style: none;
    float: left;
    font: bold 11px arial}

    #sddm li a
    { display: block;
    margin: 0 1px 0 0;
    padding: 4px 10px;
    width: 60px;
    background: #5970B2;
    color: #FFF;
    text-align: center;
    text-decoration: none}

    #sddm li a:hover
    { background: #49A3FF}

    #sddm div
    { position: absolute;
    visibility: hidden;
    margin: 0;
    padding: 0;
    background: #EAEBD8;
    border: 1px solid #666666}

    #sddm div a
    { position: relative;
    display: block;
    margin: 0;
    padding: 5px 10px;
    width: 450px;
    white-space: nowrap;
    text-align: left;
    text-decoration: none;
    background: #EAEBD8;
    color: #7A5346;
    font: 11px arial}

    #sddm div a:hover
    { background: #49A3FF;
    color: #FFF}
     
    Access, Mar 10, 2008 IP
  4. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Try setting text-align left on the li for the menu,
    could you post the menu html please so then i can try it myself.
     
    wd_2k6, Mar 10, 2008 IP
  5. Access

    Access Member

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #5
    It is here: http://javascript-array.com/scripts/simple_drop_down_menu/
     
    Access, Mar 10, 2008 IP
  6. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #6
    What do you want the text of sub-menu's aligned to the right?
    If so just do add text-align:right; to the #sddm div a in your css like so:

    #sddm div a{text-align:right;}
     
    wd_2k6, Mar 10, 2008 IP
  7. Access

    Access Member

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #7
    The reason i need it to open to the left is because i have a menu on the right hand side so there is no room.


    I just added "text-align:right", but it didnt work.

    #sddm div a
    { position: relative;
    display: block;
    margin: 0;
    padding: 5px 10px;
    width: 450px;
    white-space: nowrap;
    text-align: right;
    text-decoration: none;
    background: #EAEBD8;
    color: #7A5346;
    font: 11px arial}
     
    Access, Mar 10, 2008 IP