Image Banner Text placement

Store Design
,

Topic summary

A user wants to reposition text and a button in an image banner to appear fully to the right of a candle image, with a smaller button size.

Proposed Solution:

  • Another user provides CSS code to add to the base.css file
  • The code targets the banner container with specific width, text alignment, and positioning properties
  • Includes a media query for mobile screens (max-width: 749px)

Status:
The discussion appears to have a technical solution offered, but the CSS code snippet seems partially corrupted or improperly formatted (reversed text in some portions), which may affect implementation. No confirmation yet on whether the solution was tested or successful.

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

noah12x2_0-1729866737489.png
noah12x2_0-1729866737489.png524×207 41.2 KB

Hey, i want the text and button to be fully right besides the candle.

Maybe the button a bit smaller for this and i more lines but shorter.

Can anyone please help me with a code for this!

Appreciate your help!

https://hngie7stvgxkpp3h-85421687108.shopifypreview.com

burtah

2

Go to base.css (I’m assuming you already know now how to get to files)

Add the following code at the bottom of it:

@media screen and (max-width: 749px) {
    div#Banner-template--23673339478340__image_banner_mmm69t .banner__box.content-container.content-container--full-width-mobile {
        right: 0  !important;
        text-align: right;
        width: 60% !important;
    }
}