Есть ли способ, как сделать один ряд гипертекста в вертикальном меню?

Я создаю новую веб-страницу и создаю горизонтальное меню. Гипертекст составлен из 2 слов. Это должно быть в одной строке, но на самом деле одно слово = 1 строка. У меня здесь, в CSS, эффект наведения на него, всякий раз, когда эффект наведения работает, гипертекст находится в этот момент в одном ряду. Я немного растерялся и растерялся. Я не знаю, что изменить, можешь мне помочь?

Я уже пытался изменить атрибут CSS display на table, block, solid. Также я пытался min-width, надеясь, что текст будет расширяться в одну строку, но это не помогло вообще. Также я попытался изменить поля и отступы, но ничего не изменилось.

https://i.stack.imgur.com/AgqOJ.jpg

HTML

<div id ="panel">
 <img src= "Logo.jpg" alt="Logo">
 <h3>Nabidka</h3>
 <ul>
 <br />
 <br />
 <br />
 <li><a href ="index.html">Hlavní stránka</a></li>
 <li><a href ="program.html">Program 2020</a></li>
 <li><a href ="where_we_are.html">Kde sídlíme</a></li>
 <li><a href ="organisators.html">Organizátoři</a></li>
 <li><a href ="about_us.html">O nás</a></li>                                                    
 <li><a href ="gallery.html">Galerie</a></li>
 <li class ="last"><a href = "facebook.html">Facebook</a></li>
 </ul>
 </div>

CSS

#panel{
width: 15%;
float: left;  
background: rgb(153,153,153);
padding: 5px 0 0 0;
}

#panel h3{
display: none;
}

#panel ul{
margin: 0;                              
padding: 0;
list-style-type: none;
background: rgb(153,153,153);
}

#panel li{                                                                                                                                                                                                                                  
/*border-top: 0px solid rgb(0,176,176);*/
/*border-width: 2px 0px 0px 0px;*/ /*line between hypertexts*/
/*margin: 0px 0px 0px 0px;*/                           
/*margin-bottom: 1px;*/
display: block; 
} 

#panel a{
display: block;
width: 100px;
height: 30px;
color: black;
font-size: 120%;
font-weight: bold;
text-decoration: none;
padding: 6px 185px 6px 4px; 
margin: 5px 0px 0px 0px; 
background: rgb(153,153,153);
}

#panel a:hover{           /*redrawing*/
color: white;
text-decoration: none;
background: rgb(0,0,0);
padding: 4px 0px 4px 2px;
min-width: 100%;
}

#panel li.spodni{
height: 1500px;
}

img {
width: 200px;
height: 200px;
padding: 0px 0px 0px 20px;
}