How do I keep button position the same on all screens

[Bluetango]

Hi, 

I'm in Dawn 13.0 theme and have created a slideshow on my homepage that looks perfect in the desktop view. But when I switch to the mobile view, or the full screen view or even my widescreen computer view the button has moved and it looks really odd. How do I keep the button in exactly the same place across all screens. 

This is how it looks on desktop:

This is Mobile:

And this is wide screen:

Thank you!

[deepaksharma]

Hey there,

To fix this issue you will need to add a media query for each viewport for the buttons and the text inside the button similar to this

/* Default button styles */
.button {
    /* Your default button styles here */
}

@media screen and (max-width: 768px) {
    .button {
        font-size: 14px; /* Adjust as needed */
        padding: 10px 20px; /* Adjust as needed */
    }
}

this is just a sample you can play around till you find the perfect match, you can also take help of tools like chatGPT or Gemini to create these type of codes

[Bluetango]

Thank you - I really appreciate that and have now fixed the button position for Mobile view.

I haven't managed to fix it for a full screen or wide screen view as I'm not sure what to put instead of '@media screen and (max-width: 768px)' - could you please help?

Thank you

[deepaksharma]

can you share the url for your website.

[Bluetango]

Www.bluetango.co.nz

Thank you!