Как изменить размер выпадающего меню - CSS

Я пытаюсь изменить размер выпадающего меню с помощью css, но что-то не так с моим css. Мне нужно изменить размер, чтобы он выглядел нормально. Посмотрите на скриншот. Вот мой CSS:Как изменить размер выпадающего меню - CSS

ul#nav { 
    font-family: 'Lato', sans-serif; 
    background: #ffffff; 
    list-style: none; 
    line-height: 40px; 
} 

ul#nav li { 
    display: inline-block; 
    position: relative; 
    z-index: 8; 
} 

ul#nav li:hover { 
    color: #000000; 
    background: #ffffff; 
} 

ul#nav li a { 
    font-size: 14px; 
    font-weight: normal; 
    color: #444444; 
    height: 40px; 
    display: block; 
    padding: 0 15px; 
    text-transform: uppercase; 
    letter-spacing: 1px; 
    line-height: 40px; 
} 

ul#nav li a:hover { 
    background: #ffffff; 
    color: #000000; 
    text-decoration: none; 
} 

ul#nav li ul{ 
    display: none; 
    float: left; 
    position: absolute; 
    top: 34; 
    left: 0; 
    z-index: 5; 
    margin: 0; 
    padding: 0; 
    border: 1px solid #eeeeee; 
} 

ul#nav li ul:before { 
    content: ''; 
    display: block; 
    position: absolute; 
    left: 50%; 
    border-color: transparent transparent #eeeeee transparent; 
    border-style: solid; 
    border-width: 8px; 
    margin-left: -8px; 
    bottom: 100%; 
    width: 0; 
    height: 0; 
} 


ul#nav li:hover ul{ 
    display: block; 
    background: #ffffff; 
} 

ul#nav li ul li{ 
    background: #ffffff; 
    color: #000000; 
    min-width: 150px; 
    width: 100%: 
    white-space: nowrap; 
    float: left; 
    text-align: left; 
} 


ul#nav li ul li:hover { 
    background: #ffffff; 
} 

ul#nav li ul li a:hover { 
    color: #000000; 
    background: #ffffff; 
} 

ul#nav li ul li a{ 
    text-align: left; 
    padding-left: 10px; 
    color: #000000; 
    text-transform none! important; 
}

Я пытаюсь изменить размер: http://imgur.com/lyLTxvD

источник

2016-01-07 averty

Не могли бы вы создать JSFiddle с помощью HTML, CSS и JS? Это очень помогло бы :) - это, скорее всего, вызвано абсолютным позиционированием или плаванием, которое не очищается. –

Не могли бы вы предоставить соответствующий HTML-код? –

Несомненно, извиняюсь, что «мой первый раз создавал JFSFiddle: https: //jsfiddle.net/anxsrg3r/#&togetherjs=ASAJoPySTa – averty

Добавить height собственности в ваш ul#nav li ul селектор.

Как так:

ul#nav li ul{ 
    display: none; 
    float: left; 
    position: absolute; 
    height:200px;/*Note the change here. Edit the px to whatever you need */ 
    top: 34; 
    left: 0; 
    z-index: 5; 
    margin: 0; 
    padding: 0; 
    border: 1px solid #eeeeee; 
}

Надеется, что это помогает!

источник

2016-01-07 22:01:13 Simplicity

Большое вам спасибо !!!!! Это помогло! – averty

@averty Нет проблем, пожалуйста, не забудьте нажать галочку рядом с моим ответом, чтобы люди с подобной проблемой могли быстро найти решение – Simplicity

, что мне делать, чтобы попросить другую помощь в той же теме? – averty

редактирование Try высота линии в уль # нав Ли с.

источник

2016-01-07 21:49:03 Matas

Как изменить размер выпадающего меню - CSS

ответ

Смежные вопросы