У меня есть список и список также есть список в нем.

Я установил стили в родительском списке, но я хочу разные стили для родительского и дочернего списка, но они смешаны так, как я могу »не разделяй их.

HTML-файл:

  <a href="#">Something</a>                    
  
    <img src="https://si0.twimg.com/profile_images/135460415/UAB_dragon_head_normal.png" alt="">
    <a href="#">Username</a>
    
      
        test
        test
        test
        test
        test
        test
        test

      
    
  

CSS-файл:

body{background:#ff0000;}
#accountNavigation{ list-style: none;float: right;height: 44px;}
#accountNavigation li{ float: left;color: #fff;height: 44px;}
#accountNavigation li:hover{ background: #ddd;cursor: pointer;}
#accountNavigation li a{ text-decoration: none;color: #fff;line-height: 44px;font-weight: bold;font-size: 13px;height: 44px;padding: 15px 27px 0 14px;outline: none;}
#accountNavigation li img{ position: absolute;top: 12px;left: 10px;width: 22px;height: 22px;}
#userNavigation{position: relative;}
#userNavigation a {padding-left: 38px !important;}

#userNavigation{}
#userNavigation:hover{}
#userNavigation:hover .showme{display: inline;}
.showme
{
  display: none;
  width: 140px;
  height: 200px;
  background: #f5f5f5;
  margin: 0px auto;
  padding: 10px 5px 0px 5px;
  border: 1px solid #ddd;
  border-top: none;
  z-index: 10;
  position: absolute;
  right:0;
  top: auto;

}
#userNavigation ul { list-style: none;}

Этоскрипка.