# Flyout menu not working

**URL:** <https://community.hubspot.com/t/flyout-menu-not-working/21220>\
**Category:** CMS Development\
**Created:** [May 28, 2020, 4:14am UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220 "2020-05-28T04:14:58Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Josue](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/josue/32/58551_2.png) [@Josue](https://community.hubspot.com/u/Josue)\
**Post date:** [May 28, 2020, 4:14am UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/1 "2020-05-28T04:14:58Z")

</div>

Hello,

I am trying to make a dropdown menu but it seems I am not getting it right, I don’t know why

Here is the layout

 ![27352i85FFC922F5C564F8.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/8/80179edbd0e1e1f9744427ba2fd15089e5e1a713.png)

Here are the module settings

 ![27353i19143BAC3ED71CC9.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/4/44b17b79cab92dad26f6d95f7aa7f17360fa26e7.png)

Then, Its displayed like this:

 ![27354iF5C2F6C06CB4B2A3.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/2/4/24495eb89bfa81da6a205871e037d6b4907aceec.png)

No flyout 😞

Thanks you for your answers

---

<div class="post-metadata">

**Author:** ![Kevin-C](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kevin-c/32/34570_2.png) [@Kevin-C](https://community.hubspot.com/u/Kevin-C)\
**Post date:** [May 28, 2020, 12:43pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/2 "2020-05-28T12:43:44Z")

</div>

Hey @Josue

If you’ve got a live demo we can troubleshoot we should be able to sniff out the issue rather easily.

Based on the last screenshot I might speculate that you’re missing some CSS

---

<div class="post-metadata">

**Author:** ![Josue](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/josue/32/58551_2.png) [@Josue](https://community.hubspot.com/u/Josue)\
**Post date:** [May 28, 2020, 3:00pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/3 "2020-05-28T15:00:49Z")

</div>

No

Thanks 🙂

---

<div class="post-metadata">

**Author:** ![Kevin-C](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kevin-c/32/34570_2.png) [@Kevin-C](https://community.hubspot.com/u/Kevin-C)\
**Post date:** [May 28, 2020, 8:33pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/4 "2020-05-28T20:33:04Z")

</div>

Hey @Josue

Yep at a glance it looks like there is no styling inplace for the menu which could be your issue. I can also see there are 2 events bound to the menu items, focus and mouseout. You may be missing the mouseover event but that just speculation.

I would get your JS working and tested.

Then style your menu using the resource that @Anton provided in [this answer.](https://community.hubspot.com/t5/CMS-Development/Styling-dropdown-menus-need-to-add-to-templates-from-migration/m-p/212426#M9033)

---

<div class="post-metadata">

**Author:** ![Josue](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/josue/32/58551_2.png) [@Josue](https://community.hubspot.com/u/Josue)\
**Post date:** [May 28, 2020, 8:36pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/5 "2020-05-28T20:36:59Z")

</div>

Then the Flyout option, what exactly it does? I tought it makes the menu a dropdown, so it does nothing? I need to make the dropdown with js? Styling is not important if flyout makes it functional for now, but it doesn’t right? Documentation is not really specific.

---

<div class="post-metadata">

**Author:** ![Kevin-C](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kevin-c/32/34570_2.png) [@Kevin-C](https://community.hubspot.com/u/Kevin-C)\
**Post date:** [May 28, 2020, 8:50pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/6 "2020-05-28T20:50:16Z")

</div>

Which documentation are you working from?

---

<div class="post-metadata">

**Author:** ![Josue](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/josue/32/58551_2.png) [@Josue](https://community.hubspot.com/u/Josue)\
**Post date:** [May 28, 2020, 8:53pm UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/7 "2020-05-28T20:53:20Z")

</div>

> **[Menus and Navigation - HubSpot docs](https://developers.hubspot.com/docs/cms/start-building/building-blocks/modules/menus-and-navigation)**
>
> HubSpot has a few built-in tools to make the creation and management of these menus easy, and on the code side multiple solutions for displaying menus so you can pick the solution that makes the most sense for your website.

> **[Menus and Navigation - HubSpot docs](https://developers.hubspot.com/docs/cms/start-building/building-blocks/modules/menus-and-navigation)**
>
> HubSpot has a few built-in tools to make the creation and management of these menus easy, and on the code side multiple solutions for displaying menus so you can pick the solution that makes the most sense for your website.

Also this is the tooltip in the module:

 ![27411i9C2B32F0077D9298.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/3/a/3a1609997dfe02d3e34322a5d7ae792020baea03.png)

---

<div class="post-metadata">

**Author:** ![Josue](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/josue/32/58551_2.png) [@Josue](https://community.hubspot.com/u/Josue)\
**Post date:** [May 29, 2020, 3:05am UTC](https://community.hubspot.com/t/flyout-menu-not-working/21220/8 "2020-05-29T03:05:02Z")

</div>

I generated the dropdown myself, I guess Flyout really does nothing. Thanks all.
