Автоматическое изменение размера выпадающего меню навигации

Question

У меня проблема с адаптацией CSS для устройств с экранами меньшего размера.
Когда я изменяю размер браузера, чтобы уменьшить область просмотра, часть навигационного меню перемещается другими, делая невозможным нажатие кнопкивыше.Пожалуйста, помогите мне!

ul li{
    cursor: pointer;
    float: left;
    font-size: auto;
    width: 10em;
    height: 2em;
    margin-right: 0.25em;
    line-height: 2em;
    background-color: #666666;
    opacity: .7;
    text-align: center;
    border: solid white;
}

Answer 1

Я разрешаю использовать VH по размеру, извините за все!

Answer 2

<div class="table" >
<link rel="stylesheet" type="text/css" href="link" />
<h3 draggable="false" class="unse">
<ul>        
<li><a onClick="location.href='link'">Home</a>
<ul>
<li><a onClick="link'">Homepage</a></li>
</ul>
</li>
</ul>
<div/>

это пример HTML.