Custom text/button position in hero image on mobile

Hello!

I am looking to move the positioning of my hero text/button (it is currently in the center)

The goal is to move it to the bottom of the hero image.

Can anyone help me out?

Please and thank you!

https://viellabeaute.com/

pw: viella

Hi @sotangy

What theme are you using? Do you have a dropdown that allows you to choose the text positioning per slide? Let us know!

Hello!

I am using Broadcast by Invisible themes.

I did use the drop down to place it at bottom-left, however, this only applies to the desktop view.

The mobile view doesn’t have any options to adjust the positioning.

Clear, and would creating a dropdown for mobile make sense for you? Or should it always be on top?

Let us know!

Sorry I don’t understand your question, Dropdown menu in the customizer to adjust the mobile positioning? If so, yes that would be helpful.

I tried the following code:

media only screen and (max-width: 768px)
.homepage-slideshow .hero__content–transparent {
padding: 30px;
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
}

It works when I’m messing around in the inspect tool, but once I add to my actual code, it doesn’t show up in the refresh live.

Hi got it :grinning_face_with_smiling_eyes:

@media screen and (max-width: 989px){
.hero__content.hero__content–transparent {
position: absolute;
bottom: 0;
}
}