Problem with the sub-menu colors from an extra button

This topic has 5 replies, 2 voices, and was last updated 3 years, 3 months ago by Fernando.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
January 24, 2023 at 12:30 am #2506767

Robert

Hi

I addes this code, for the red button in the MENU, into to the CSS:

/* podswietlanie MENU w ANCHOR */

.main-navigation .main-nav ul li[class*=”current-menu-“]:hover > a {
color: #1B1E51;
background-color: #ffffff;
}

/* studio classes menu button */

.main-navigation:not(.slideout-navigation) .main-nav li.studio-button a {
background-color: rgba(234,60,36,1.0);
color: #ffffff;
border: 0;
line-height: 40px;
padding: 0px 24px;
border-radius: 6px;
margin-left: 30px;
margin-top: 1px;
transition: all 0.5s ease 0s;
}

.main-navigation:not(.slideout-navigation) .main-nav li.studio-button a:hover {
background-color: rgba(133,129,136,0.9);
color: #ffffff;
transition: all 0.8s ease 0s;
}

The sub-menu looks now like this:
https://snipboard.io/GzmahS.jpg

but the sub-menu from the red button looks:
https://snipboard.io/NUdmt0.jpg

It’s passible to change the code so, that the sub-menu from the red button
will looks like: https://snipboard.io/GzmahS.jpg ?

Kr
Robert

January 24, 2023 at 12:42 am #2506773
Fernando
Customer Support
Hi Robert,

Try replacing this:
```
.main-navigation:not(.slideout-navigation) .main-nav li.studio-button a {
background-color: rgba(234,60,36,1.0);
color: #ffffff;
border: 0;
line-height: 40px;
padding: 0px 24px;
border-radius: 6px;
margin-left: 30px;
margin-top: 1px;
transition: all 0.5s ease 0s;
}
```
with this:
```
.main-navigation:not(.slideout-navigation) .main-nav li.studio-button > a {
background-color: rgba(234,60,36,1.0);
color: #ffffff;
border: 0;
line-height: 40px;
padding: 0px 24px;
border-radius: 6px;
margin-left: 30px;
margin-top: 1px;
transition: all 0.5s ease 0s;
}
```
January 24, 2023 at 1:19 am #2506797

Robert

Hi

thx!

The colors are OK, but it’s passible to move the sub-menu from the red button a bit to the right so
it would start how is the red, vertical line on the print screen?

https://snipboard.io/M8QcRk.jpg

?

Something like the other, normal sub-menu:
https://snipboard.io/o3QxyP.jpg

Thx
Robert

January 24, 2023 at 1:36 am #2506803

Robert

I have it 🙂

thx

January 24, 2023 at 1:36 am #2506804
Fernando
Customer Support
Try adding this as well:
```
.main-navigation:not(.slideout-navigation) .main-nav li.studio-button ul.sub-menu {
    margin-left: 30px;
}
```
January 24, 2023 at 1:38 am #2506806

Fernando
Customer Support

I see. You’re welcome, Robert!
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

[Resolved] Problem with the sub-menu colors from an extra button

Popular Articles

[Resolved] Problem with the sub-menu colors from an extra button

Popular Articles

Start building better websites today.