Панель навигации имеет ненужные места слева и справа

Question

Я включил все CSS и HTML, необходимые для воспроизведения моей проблемы. Это мой первый сайт, и я создаю рандомизатор персонажей D & D. Код, который я использовал для своей навигационной панели, взят из моего учителя. Я просмотрел другие посты на этом форуме, но, похоже, не смог решить мою проблему. Спасибо

Изображение вопроса

/* CSS for the Menu */
#Menu {
    font-size: 25px; /* Font size of 25 px */
   }
   
   /* CSS for the Menu background */
   #Menu ul {
     list-style-type: none; /* No Bullets */
     overflow: hidden; /* No Scroll Wheel */
     background-color: rgb(77, 39, 21); /* Background colour of the Menu */
     margin-bottom: 0px; /* Margin from the top div is 0 */
     margin-top: 0px /* Margin from the top div is 0 */
   }
   
   /* CSS for Menu Edges*/
   #Menu li {
     float: left; /* Menu is floated to the Left to make it all in one line */
     border-right: 1px solid rgb(104, 99, 99); /* Left border line of 1 px separating blocks. */
     border-left: 1px solid rgb(104, 99, 99); /* Right border line of 1 px separating blocks. */
   
   }
   
   /* CSS for Menu Tabs */
   #Menu li a {
     display: block; /* Turns it into a block display */
     color: rgb(187, 180, 180); /* Background colour of Text */
     text-align: center; /* Aligns text to the middle of the block */ 
     padding: 16px 177px; /* Padding of 16px and 177 px between blocks */
     text-decoration: none; /* Makes sure there are no underlines */
   }
   

<link rel="stylesheet" type="text/css" href= "StylesheetQ.css">

<div id="Menu">
    <ul>
       <li><a class="active" href="Main Page.html">Home</li></a></li>
       <li><a href="About.html">About</li></a></li>
       <li><a href="Contacts.html">Contacts</li></a></li>
       <li><a href="Testimonials.html">Testimonials</li></a></li>
   </ul>
</div>

Answer 1

На вашей ул. Есть отступ.

Так что пишите padding:0;, и вы хороши для go.

Для ваших проектов вам может быть интересно использовать CSS Сбросить как этот

Answer 2

Сбросить отступ до 0.

#Menu { 
    font-size: 25px;
    padding: 0;
}