Center button in a section on homepage?

Topic summary

A Shopify store owner is trying to center an ‘enter’ button on their homepage.

Initial Solution Provided:

  • Add CSS code to the theme’s stylesheet (base.css, style.css, or theme.css)
  • The suggested code targets .videoBackground.videoBox with justify-content: center

Implementation Issues:

  • The user initially struggled with proper code placement in base.css
  • Forgot to include opening/closing <style> tags around the CSS
  • Once corrected with proper formatting, the solution successfully centered the button

Follow-up Question:

  • User asks whether desktop CSS changes automatically apply to mobile view
  • Concerned because mobile site doesn’t match desktop appearance
  • Discussion remains open regarding mobile responsiveness, with a helper asking for clarification on desired mobile layout

Status: Primary issue resolved, but mobile styling question pending response.

Summarized with AI on November 17. AI used: claude-sonnet-4-5-20250929.

How can I center the ‘enter’ button on my homepage? I have looked all around and none of the solutions are working for me. Thank you!

https://shortcomings.store/

password: aloe

1 Like

Hi @shortcomings

Try this.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.videoBackground .videoBox {
    justify-content: center;
}
  • And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

Thank you for your quick response! I have added the code to base.css like this, is this correct? Nothing seems to have changed after saving and viewing my site.

1 Like

Hi @shortcomings ,

This is Anthony from Beae Landing Page Builder, and I’m happy to assist you today.

While I acknowledge that this issue falls short of the desired outcome, I have an idea that I believe might be of help:

  1. Go to Online Store → Theme → Edit code
  2. Open your theme.liquid file
  3. Paste below code before :

Best regards,

Anthony

Am I placing the code in the correct way?

Nevermind, I forgot the STYLE things at the beginning and end. That worked, thanks so much!

1 Like

While I have you, could you help me with a couple more things? Or do I have to create a new question in the community?

can you put this one in the theme.liquid file. before the tag.


Thanks!

I think you should create a new topic. There will be many people to support you if the problem is beyond my understanding.
Best regards,
Anthony

It’s still relating to this button thing. Just real quick, is the code I add to various sections of my theme carried over onto the mobile side automatically, or do I have to add the same code to Desktop & Mobile separately? Because my mobile site looks nothing like the desktop one.

Do you want to be like this on mobile