[PRO] How to change from Column to row and vice-versa with code

Hey guys,

there’s something about pro that has been sort of haunting me recently. i know that each bar and container created inside a footer/header in PRO gets a dynamic class. i have the following class (see below) that has a flex-direction:row parameter,

.fm7c652e56-f202-466d-97c3-faf15715d0e2.x-menu{
 flex-direction:row;
}

as you can see it’s just an inline menu element and if i change the direction to “column” it just shows the elements of the menu as a column.

i would like to achieve the same with a class or an ID instead of being forced to use the same dynamic class as shown in the previous example.

i tried giving the class “.stacked-menu” to the inline menu and tried to just emulate the same structure as with the dyynamic class (default one), but with a different flex-direction (column)

here’s how it looked:

.stacked-menu.x-menu{
 flex-direction:column;
}

the result? nothing changed :frowning: this issue has happened to me a few times with different experiments and i still haven’t had the opportunity of investigating it by myself, so i wanted to make use of this opportunity to kill 2 birds with one stone and get everything explained with a real problem.

thanks in advance for the response!

This is an automated message to notify you that your thread was posted in the wrong forum, and it has been moved to the correct place. A member of our team will be happy to reply just as soon as your thread is up. How support works.

For support, please post all questions in the Support Forum.

For peer to peer conversations with other Themeco customers about tips, customizations, or suggestions you are welcome to use the Peer to Peer Forum (no official support provided here).

Design & Development, Marketing & Media, and Hosting & Optimization are for discussion with fellow Apex members about non Themeco related topics. Please keep this in mind in the future.

Thank-you!

1 Like

Hi,

To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you.

you won’t really find anything in the site (written below), though, it’s just a question i’m asking because i want to change by code the way the bar behaves, and i just tried to do so by giving it a class and change the flex direction, but it only works if use (i want the footer menu to look as a row when the user accesses my site from a desktop and as a column when it’s been viewed from a mobile phone).

First, the random string is used in the builder only. In the front-end, it is assigned a class of hm1 for the first header and fm1 for the first footer.

Even with that, applying a custom class should work. But, your CSS is wrong. You used . instead of # for an ID.

It should be

#stacked-menu.x-menu

Thanks.

lol! i wanted to use a class, but i didn’t really noticed that i had assigned an ID instead! awesome, thanks, i’ll try that.

Thank you!