menu css

Discussion in 'CSS' started by bdfsar, Apr 24, 2013.

  1. #1
    i have problem with the css selectors of "UL"

    i have 2 ul on my menu
    but how i disable from ul 1 to effect 2 ul with css
    i mean when i make css for ul 1 is automatic make the same css to ul 2

    the same is in the li






    sorry for my English.
     
    bdfsar, Apr 24, 2013 IP
  2. GMF

    GMF Well-Known Member

    Messages:
    855
    Likes Received:
    113
    Best Answers:
    19
    Trophy Points:
    145
    #2
    Give the ul an unique id and apply css to that...


    More info
    http://www.tizag.com/cssT/cssid.php
    Code (markup):
     
    GMF, Apr 24, 2013 IP
  3. Mike In

    Mike In Active Member

    Messages:
    244
    Likes Received:
    5
    Best Answers:
    2
    Trophy Points:
    90
    #3
    Something Like This
    <ul id='menu'>
    <li></li>
    <li></li>
    </ul>
     
    <ul id='menu_2'>
    <li></li>
    <li></li>
    </ul>
    HTML:
     
    Mike In, Apr 24, 2013 IP
  4. Devtard

    Devtard Notable Member

    Messages:
    850
    Likes Received:
    133
    Best Answers:
    4
    Trophy Points:
    220
    #4
    You can also use property: value !important; to override default CSS rules.
     
    Devtard, Apr 26, 2013 IP
  5. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #5
    If you think that will solve the problem, you have two problems. It means you haven't used the cascade effectively or you haven't developed a sane system of hooks.

    The use of !important is harmful; it overrides user styles, a Bad Thingâ„¢

    cheers,

    gary
     
    kk5st, Apr 27, 2013 IP
  6. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #6
    If we could see your markup AND your CSS it would help -- normally if it's just one in another put an ID on the outer one but not the inner, if they're really nested, and for the LI, just unset any values you set on the nested one.
     
    deathshadow, Apr 28, 2013 IP
  7. Devtard

    Devtard Notable Member

    Messages:
    850
    Likes Received:
    133
    Best Answers:
    4
    Trophy Points:
    220
    #7
    kk5st: I just wanted to point out another way of styling elements. For me it is a quick solution that you can use when you don't want to bother with complex CSS files. Maybe it is not the best thing you can do but I don't see any harm in using it. If it works, why the heck not?
     
    Devtard, Apr 28, 2013 IP
  8. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #8
    As he said, it can prevent user.css from working in some browsers (Opera it still works). Generally speaking it's extra code and if you 'need' to use it, there's probably something wrong with the orders in the first place. Just because something works doesn't mean you should do it that way.
     
    deathshadow, Apr 28, 2013 IP
    Devtard likes this.
  9. codingforever99

    codingforever99 Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #9
    you have to make a different between these two objects, the best thing is to use id
    for example :
    <style>
    .tabs{
    //will effect for both ul
    .........
    }
     
    #ul_1 {
    // only effect for only the first ul
    ..........
    }
     
    </style>
     
    <ul id="ul_1" class="tabs">
            <li>A1</li>
            <li>B1</li>
            <li>C1</li>
    </ul>
    <ul id="ul_2" class="tabs">
            <li>A2</li>
            <li>B2</li>
            <li>C2</li>
    </ul>
    
    HTML:
     
    codingforever99, May 12, 2013 IP
  10. moon_gfx77

    moon_gfx77 Active Member

    Messages:
    57
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #10
    if you are using a ul in sub-menu then use hierarchic of CSS
    like :
    .menu ul {style}
    .menu ul li ul{sytle}
    and if any style impact on sub li then use !important tag before closing property
    like : font-weight:bold !important;
     
    moon_gfx77, May 13, 2013 IP
  11. BradsFX

    BradsFX Active Member

    Messages:
    92
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    55
    Digital Goods:
    2
    #11
    This would work, but why would you want to change the ul, or separate one from another?
     
    BradsFX, May 13, 2013 IP