Why do I have extra room in my Navbar?

Design help Layout & Design
1

I’ve created a fixed Navbar element for a restaurant site I’m building. My problem is that there is a lot of extra space to the left of the Logo Block and also to the right of the Nav Menu div. If you click on the Navbar Container element in the Navigator and then go over to the Styles panel and hover over the Padding style in the Spacing section, you can see that I have 24 pixels of padding on the left and the right. This is because I only want 24 pixels of padding between the left side of the Logo Block and edge of the parent Navbar container. But instead, there is an additional, roughly 96 pixel gap between the logo block and edge of the container. The same thing is happening on the right side between the Nav Menu div and the Navbar Container edge. Why am I getting these additional gaps and how do I get rid of them? I want the Logo Block to be only 24 pixels from the left edge of the Navbar and the Reservations link to only 24 pixels from the right edge. Thanks.

Here is my site Read-Only: https://preview.webflow.com/preview/project-template-f87aff-8c6ee77a4c352a5?utm_medium=preview_link&utm_source=designer&utm_content=project-template-f87aff-8c6ee77a4c352a5&preview=391c9bce2f4b1b8c3393fbe9d7c40c34&workflow=preview

2

Use a regular div instead of a container block.

Screen Shot 2021-08-12 at 6.59.40 PM
Screen Shot 2021-08-12 at 6.59.40 PM2898×414 117 KB

3

Thanks very much! I’ve been scratching my head over this for over a day now. After looking at your answer, I came upon this Webflow article that describes the difference between a Container and a Div. It would appear that the width of a Container is limited to 940 pixels.