Image Card Customise - CSS required

Site URL: https://www.makeyourmarksuper.com.au/story-design

Hi guys,

I'm using Squarespace 7.0, and am building out our companies story.

I'd love to know if the following design that I have attached can be created through CSS code?

Basically, I'd like to have:

- The Image Card text below the image,

- A background colour being the whole image card?

- The image is  to the left of the "image card"?

Any ideas?

Hi @TomStapes, if you set the image to Stack and then use this Custom CSS:

#block-yui_3_17_2_1_1663908936907_7671 {
    background:#d7e5f0;
    margin-left:30px !important;
    margin-top:30px !important;
  .sqs-image {
    margin-left:-30px !important;
    margin-top:-30px !important;
  }
}

Change the Block ID at the top if I haven't pulled the correct one from the website, and adjust the margins to suit your design.

Let me know if this is enough info for you to do the rest, good luck!

Probably not relevant, but this type of design is easily achieved without CSS in the new Fluid Engine in Squarespace 7.1.