样式下拉菜单元素

Question

我想样式下导航的水平（例如，增加下拉的宽度），但找不到相关的选择器更改。该网站是http://www.mattmaclennan.co.uk/a2

举例：在“新摩托车”降了下来，我想增加宽度，然后将侧翻的元素在一旁

我知道要使用的代码，但我只是无法找到相关选择器来执行此操作。把我的头发拉出来！

感谢您的任何建议提前！

Answer 1

也许这会帮助吗？ http://jsfiddle.net/Xtu9t/

<nav> 
<ul> 
    <li><a href="#">Home</a></li> 
    <li><a href="#">New Motorcycles</a> 
     <ul> 
      <li><a href="#">Adventure</a></li> 
      <li><a href="#">125cc</a></li> 
      <li><a href="#">foofoo</a> 
       <ul> 
        <li><a href="#">subsub</a></li> 
        <li><a href="#">subsub2</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li> 
    <li><a href="#">Used motorcycles</a> 
     <ul> 
      <li><a href="#">Motor 1</a></li> 
      <li><a href="#">Motor 2</a></li> 
     </ul> 
    </li> 
    <li><a href="#">etc</a></li> 
</ul> 

其基本下拉所以你必须做一点点的造型你自己。但这里是css

body {  
font-family: Helvetica, sans-serif; 
font-size: 14px; 
line-height: 10px; 
} 

nav ul ul { 
display: none; 
} 
nav ul li:hover > ul { 
    display: block; 
} 


nav ul { 
    background: red; 
    list-style: none; 
    position: relative; 
    display: inline-table; 
} 
nav ul:after { 
content: ""; 
clear: both; 
display: block; 
} 

nav ul li { 
    float: left; 

} 
    nav ul li:hover { 
     background: black; 
    } 
     nav ul li:hover a { 
      color: #fff; 
     } 

    nav ul li a { 
     display: block; 
     padding: 25px 20px; 
     color: #fff; 
     text-decoration: none; 

    } 


nav ul ul { 
    background: red; 
    padding: 0; 
    position: absolute; 
    top: 100%; 
} 
    nav ul ul li { 
     float: none; 
     position: relative; 
    } 
     nav ul ul li a { 
      padding: 15px 20px; 
      color: #fff; 
     }  
      nav ul ul li a:hover { 
       background: #000; 
      } 

nav ul ul ul { 
    position: absolute; 
    left: 100%; 
    top:0; 
} 

正如你可以看到没有类或ID的地方使用。