Can someone help me please?
I have these two images on one image banner. I want them to have a text and button each on both sides. How Do I move the second text and button to the right like in the screenshot?
Main issue: On a Shopify image banner with two images, the poster wants each image to have its own text and button, with the second text/button aligned to the right (as shown in an attached screenshot). A store page URL was provided for context.
Proposed solution: A reply suggested adding custom CSS that targets specific elements using CSS nth-child selectors, setting position: absolute and right: 50px to move the second text and button to the right. It also suggested explicit button dimensions (height and width). In short: use CSS (absolute positioning + nth-child) to place the second set on the right.
Implementation guidance: The CSS can be added in the theme’s custom CSS or global CSS. A video link was shared for instructions, but it’s currently unavailable.
Current status: Unresolved/ongoing. The original poster asked where to paste the code, and another participant requested a working link to the video. A different user reported the same issue (both buttons appearing together) and asked if a solution was found.
Notes: An illustrative screenshot is central to understanding the desired layout.
Can someone help me please?
I have these two images on one image banner. I want them to have a text and button each on both sides. How Do I move the second text and button to the right like in the screenshot?
No thanks. Can someone else help me please?
.hero__content p.hero__description:nth-child(3), .hero__content .hero__button:nth-child(4) {
position: absolute;
right: 50px;
}
.hero__content .hero__button:nth-child(4) {
height: 6rem;
width: 8.5rem;
}
Where do i paste this code?
You can add either on custom css or global css.
Hi @jinuralite
Did you get the answer?
Can you please help?
I have a similar issue where two images in a banner are having the buttons together