# Navigation Menu Bunched up

**URL:** <https://community.hubspot.com/t/navigation-menu-bunched-up/96078>\
**Category:** Blog, Website & Page Publishing\
**Tags:** website-pages\
**Created:** [December 14, 2023, 9:22am UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078 "2023-12-14T09:22:26Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![DHayward3](https://avatars.discourse-cdn.com/v4/letter/d/c77e96/32.png) [@DHayward3](https://community.hubspot.com/u/DHayward3)\
**Post date:** [December 14, 2023, 9:22am UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/1 "2023-12-14T09:22:26Z")

</div>

Hi,

I am having problems with my Navigation menu for my website.

I have added a ‘Menu’ module to my global content header. However, the styling for menu that I have created is way off and nothing seems to fix it. All the menu title are grouped together. How do I change this? Please see a screen grab of the menu on the webpage.

 ![Menu issues.PNG](https://d2qpr2jzcazej7.cloudfront.net/original/2X/8/8fc249e91b42eab7826068069d55639827ce340e.png)

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![Jigar\_Thakker](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jigar_thakker/32/63606_2.png) [@Jigar\_Thakker](https://community.hubspot.com/u/Jigar_Thakker)\
**Post date:** [December 14, 2023, 9:56am UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/2 "2023-12-14T09:56:06Z")

</div>

@DHayward3

To fix the styling of the Navigation menu recheck with your developer whether your module code is correct or not, you can customize your sitemap in HubSpot by creating a new menu or cloning an existing one and adding pages to it.

You can also add child pages for a dropdown. After making changes, click Publish to save : [Set up site navigation menus](https://knowledge.hubspot.com/website-pages/set-up-your-site-s-navigation-menus)

Let me know if you have any follow-up questions.  
If my post was helpful in addressing your query, Support the community by indicating it as the solution.

---

<div class="post-metadata">

**Author:** ![DHayward3](https://avatars.discourse-cdn.com/v4/letter/d/c77e96/32.png) [@DHayward3](https://community.hubspot.com/u/DHayward3)\
**Post date:** [December 14, 2023, 1:10pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/3 "2023-12-14T13:10:51Z")

</div>

Hi Jigar,

Thanks for your reply. The theme I used is one of HubSpot’s defaults. I created a menu from scratch but regardless of the theme that I use it just appears as in the image in the original post

---

<div class="post-metadata">

**Author:** ![Jigar\_Thakker](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jigar_thakker/32/63606_2.png) [@Jigar\_Thakker](https://community.hubspot.com/u/Jigar_Thakker)\
**Post date:** [December 14, 2023, 3:27pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/4 "2023-12-14T15:27:23Z")

</div>

@DHayward3

Have you tried reaching out to HubSpot support regarding this?

---

<div class="post-metadata">

**Author:** ![Rokib31](https://avatars.discourse-cdn.com/v4/letter/r/fbc32d/32.png) [@Rokib31](https://community.hubspot.com/u/Rokib31)\
**Post date:** [August 7, 2024, 4:13pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/5 "2024-08-07T16:13:11Z")

</div>

How to clone a navigation menu with style?

---

<div class="post-metadata">

**Author:** ![Bna9](https://avatars.discourse-cdn.com/v4/letter/b/d2c977/32.png) [@Bna9](https://community.hubspot.com/u/Bna9)\
**Post date:** [January 10, 2025, 4:32pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/6 "2025-01-10T16:32:35Z")

</div>

[**Dunkin Donuts Menu**](https://dunkindonutsmenuph.net/) serves Classic Donuts, Premium Donuts, Munchkins Bucket, Hot and Cold Beverages, Poppins Tea, Kiddie Pearl, Combos, Bunwich & Croissant, and Waffles.

---

<div class="post-metadata">

**Author:** ![GKitua](https://avatars.discourse-cdn.com/v4/letter/g/f08c70/32.png) [@GKitua](https://community.hubspot.com/u/GKitua)\
**Post date:** [March 9, 2024, 10:55am UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/7 "2024-03-09T10:55:20Z")

</div>

I am experiencing the same problem. Was this resolved?

---

<div class="post-metadata">

**Author:** ![Rokib31](https://avatars.discourse-cdn.com/v4/letter/r/fbc32d/32.png) [@Rokib31](https://community.hubspot.com/u/Rokib31)\
**Post date:** [August 7, 2024, 4:34pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/8 "2024-08-07T16:34:06Z")

</div>

![Screenshot_2024-08-04_15-24-27.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/c/9/c96549370a8287c87b6058910334b2f481f5038f.png)

 ![ScreenShot Tool -20240807222710.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/6/1/61152b3b6c7fb1c725a81944bb3e0bb917d08824.jpeg)

the navigation menu is not showing, if I create a new menu and add it to the global header style it is very odd and not useable.

---

<div class="post-metadata">

**Author:** ![SGeek4](https://avatars.discourse-cdn.com/v4/letter/s/e19adc/32.png) [@SGeek4](https://community.hubspot.com/u/SGeek4)\
**Post date:** [October 2, 2024, 4:04am UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/9 "2024-10-02T04:04:01Z")

</div>

Issue at your end resolved? I am facing the same issue on my menu site .

---

<div class="post-metadata">

**Author:** ![starbuck](https://avatars.discourse-cdn.com/v4/letter/s/9dc877/32.png) [@starbuck](https://community.hubspot.com/u/starbuck)\
**Post date:** [February 15, 2025, 8:31pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/10 "2025-02-15T20:31:10Z")

</div>

Hi there,

It sounds like your navigation menu is as bunched up as a crowded Starbucks during the morning rush! Let’s help you untangle it.

Here are a few steps to troubleshoot:

1. **Check Your CSS Styling:**  
Just like Starbucks carefully arranges its menu items, your navigation menu needs proper spacing and alignment. Inspect your CSS to ensure there’s no conflicting styling or missing padding/margin properties.
2. **Review the Module Settings:**  
Think of your ‘Menu’ module as a Starbucks drink—sometimes, it needs a little tweaking to get it just right. Double-check the module settings to ensure the layout and spacing options are configured correctly.
3. **Inspect for Overlapping Elements:**  
If your menu titles are grouped together, it could be due to overlapping elements. Use your browser’s developer tools (right-click \> Inspect) to identify any issues.
4. **Test Responsive Design:**  
Just like Starbucks ensures its menu looks great on both mobile and desktop, make sure your navigation menu is responsive. Test it on different screen sizes to see if the issue persists.

If you’re still stuck, feel free to share more details or the screen grab, and we’ll help you get your menu looking as smooth as a perfectly brewed latte!

---

<div class="post-metadata">

**Author:** ![Benztacker](https://avatars.discourse-cdn.com/v4/letter/b/ecc23a/32.png) [@Benztacker](https://community.hubspot.com/u/Benztacker)\
**Post date:** [February 27, 2025, 12:44pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/11 "2025-02-27T12:44:41Z")

</div>

To fix the **Navigation Menu bunched up** issue, check the CSS for spacing, padding, and flex properties in your global content header. Using display: flex; or justify-content: space-between; might help distribute the menu items properly. Also, while troubleshooting, consider how you **create engaging content** —a well-structured, user-friendly menu enhances the overall user experience!

---

<div class="post-metadata">

**Author:** ![julia](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/julia/32/154_2.png) [@julia](https://community.hubspot.com/u/julia)\
**Post date:** [June 30, 2026, 4:27pm UTC](https://community.hubspot.com/t/navigation-menu-bunched-up/96078/12 "2026-06-30T16:27:38Z")

</div>

Opened on June 30, 2026, 4:27pm UTC


