different secondary menus

[cschm.tz]

@arminunruh thanks so much! feel like i had been here before and had issues but it's working now which is what counts! have a lovely week :)

[cschm.tz]

@cschm-tz

hi @arminunruh after cleaning my cache on mobile I have now found what the issue was, the last time I copied the css from the desktop version into the mobile version.

What you suggested does fix things when shrinking the browser on desktop. However, on mobile it moves the caption to a different position (bigger bottom and left margins). Please see attached — seems like going in a vicious cycle! :(

What do you think this could be?
Thanks again!

[arminunruh]

this happens because some of your captions span multiple lines because they are longer.

use this css instead:

.lay-carousel-sink .single-caption{
vertical-align: bottom!important;
}

and

.lay-carousel-sink {
    position: fixed !important;
    bottom: 12px!important;
    left: 12px !important;
    z-index: 999 !important;
}

the difference is we align the texts to the bottom and we change "bottom: -24px;" to "bottom: 12px;" for the wrap

[cschm.tz]

@arminunruh said in different secondary menus:

.lay-carousel-sink {
position: fixed !important;
bottom: 12px!important;
left: 12px !important;
z-index: 999 !important;
}

Hi @arminunruh

Sorry but that only seems to be working for chrome but not for safari or mobile, screenshots attached...I worry that we're going in circles, is there any chance you understand what is happening, I am asked to share final site before the weekend?

Thank you!

[arminunruh]

@arminunruh said in different secondary menus:

.lay-carousel-sink .single-caption{
vertical-align: bottom!important;
}

this is the important part of the css

[arminunruh]

here you have an empty <p> </p> tag, causing your caption to be positioned differently

[arminunruh]

i will release an update today that will fix it

[arminunruh]

ok u can update now, then it should work

[cschm.tz]

@arminunruh thanks Armin, just to clarify, what do I need to update on my side? The css you share has been applied both for Desktop CSS and Mobile CSS?

[arminunruh]

just update your lay theme and remove the empty <p></p>
tag

the css is correct already it seems

if it doesnt work:

can you send your website address, /wp-admin/ username and password and a link to this topic to info@laytheme.com?