Image Banner Text placement Desktop

Store Design
,
1

noah12x2_0-1729866905217.png
noah12x2_0-1729866905217.png1893×579 111 KB

Hey for my Image Banner of the desktop version on my site, i would like to place the text and button a bit lower right besides the candle so it looks better.

Can anyone help me with a code to change the placement of the content container?

Appreciate your help!

https://hngie7stvgxkpp3h-85421687108.shopifypreview.com

burtah

2

Hi Noah,

Go to your code editor and find a file called ‘section-image-banner.css’ and find the following code

.banner--desktop-transparent .banner__box {
        padding: 4rem 0;
        background: transparent;
        max-width: 89rem;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

and add one extra life before } making it look like the following:

@media screen and (min-width: 750px) {
    .banner--desktop-transparent .banner__box {
        padding: 4rem 0;
        background: transparent;
        max-width: 89rem;
        border: none;
        border-radius: 0;
        box-shadow: none;
        position: absolute; /* extra code *
    }
}

let me know if it didn’t work

3

not working. picture isnt there anymore with this code

1 Like
4

Lets do this, find a file called mage-banner.liquid and add the following code at the bottom of the page
5

Had some Content container placement codes before and we all did it in base.css is it possible if we do it there aswell?

1 Like
6

try adding the following code at the bottom of your base.css

@media screen and (min-width: 750px) {
    .banner--desktop-transparent .banner__box {
        position: absolute !important;
    }
}