How can I align the CTA button with the image above it?

Store Design
, ,

Topic summary

A user seeks help aligning a CTA (Call-to-Action) button with an image positioned above it on their Shopify store using the Blackery theme.

Proposed Solutions:
Two respondents suggest similar CSS fixes:

  • Navigate to Online Store → Themes → Actions → Edit Code
  • Add CSS code to the assets/timber.css file (at the bottom)
  • The code targets .section.align-middle-center with display: flex and justify-content: center properties

Note: The original post includes a screenshot showing the alignment issue, which provides visual context for the problem.

The discussion appears resolved with actionable CSS customization steps provided.

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

Screenshot 2022-11-07 at 18-43-36 Ploutone - Home of the Modern Guitarist.png
Screenshot 2022-11-07 at 18-43-36 Ploutone - Home of the Modern Guitarist.png1875×826 229 KB

Website is www.ploutone.com. Theme is Blackery.

Thanks in advance for the help!

2

Hi @Ploutone .

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can go to Online store => themes => actions => edit code and add this code on file timber.css

.section.align--middle-center{
display: flex;
justify-content: center;
}

Hope this answer helps.

Best regards,

Richard | PageFly

1 Like
3

Please add below css code in bottom of assets/timber.css file

.section.align–middle-center {
display: flex;
justify-content: center;

}
Thank you.

1 Like