Mega menu and text overlapped

[ICT73]

I’m trying to get a mega menu with the toggle as an image and the text above it aligned in the center and both must be responsive. But the text of the toggle is always aligned and never overlapped with the graphics of the toggle.

[marc_a]

Hi @xonetit,

Thanks for reaching out!

If you want your text overlay or at the top of your image. Just enable the text setup option of your toggle then add the text.

Then you also need to enable the Graphics settings so that you can assign your image.

Then to make the text overlay with the image, please add the code in your mega menu element CSS.

$el .x-anchor-text {
  position: absolute;
}

After applying that code, the text will overlay with the image. Please note that custom CSS code is outside the scope of our support. Issues that might arise from the use of custom CSS code and further enhancements should be directed to a third-party developer or you can avail One where we can answer questions outside of the features of our theme.

Hope that helps.

Thank you.

[ICT73]

thanks a lot for support Marc. I’ve a problem with mobile version. When opening the mega menu of the last two toggles the menu stretches upwards, is there a way to align the mega menu when it appears?

moreover it’s possible get the second coloum whit different height?
eg:

[tristup]

Hi @xonetit,

Unfortunately, not able to replicate the issue in the mobile devices. I would request you please provide any screenshot marked with the issue or any video that helps us to recognize the problem.
Regarding the Grid element and the column structures, I would suggest you go through this article: https://theme.co/docs/grid

Thanks

[ICT73]

I would request you please provide any screenshot marked with the issue or any video that helps us to recognize the problem.

http://cloud.movavi.com/show/b9D5YqnioI7LeZu3hgVzFNxHymQPR0Xj

[marc_a]

Hi @xonetit,

It is seems this is just a mobile behavior because when you scroll a little more at the bottom, your toggle menus is located at the bottom not at the top. See the video I created in the secure note.

Hope that helps.

Thank you.

[ICT73]

ya it’s only on mobile version, but why it’s works so?

[tristup]

Hi @xonetit,

It usually happens as it calculates the rendered height, if that the popup can’t be shown in that height, it automatically comes up top of the page. It happens even while you right-click in the Windows and it exactly shows the popup in that way.

Thanks for understanding