I am trying to create a card and imagebox that has an overlay image that centers itself over a flex of image and text area. I can get it to work on one size but changing screen width moves the image vertically out of alignment.
(see Our Method/mission):
elementsapp://downloadDocument/0ykrBSFNKJkz
also still looking for a way to apply opacity to only the background in cards 4 and 5
Thanks,
rashley
Hi @rashley,
I’m 100% sure you’ll be able to do what you want in Elements, and that we’ll be able to help you. However, I couldn’t quite follow your instructions on what you wanted (sorry).
Let’s tackle the card issue first. As far as I can see the circular image stays centred in the card when resizing the page. What is the issue here?
If you can give me some more information on what you’re trying to do I’m sure I’ll be able to help 
Edit: I see your card is a custom component… you would be able to build these with our native built-in components. Would you like me to do that for you?
Thanks for the response!,
The card issue is that the background opacity dims the entire card not just the background. I know I must have the bgOpacity in the wrong place but have never worked with tailwind before and my css is old and forgotten. (40+years ago)(It was new back then and only a hobby)
The other issue is with the sizing of the “our methods” card and the overlay image moving vertically and the card not shrinking to fit in a grid.
I am trying to mimic the stacks on this page": https://adaptivetherapiesnm.com
Sorry I’m so out of touch with doing this.
Can any of your new scaffolding cards mimic this overlay format?
Thanks
Robert Ashley