Jump to content

Putting text over an image better than squarespace's default

Recommended Posts

  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

7 minutes ago, Wolfsilon said:

Hi,

It's possible to adjust the position of the text using Custom CSS. However, I'd like to point out that having it break lines the way you want it too, may be a bit more tricky than expected. If you would like to word to be positioned to the top-right.

Best,

Dan

I see. Well having the words over the microphone doesn't look great. Is there a way to put the text somewhere where the microphone isn't? Perhaps one word on each line and justified to the right?

 

Thanks so much

Link to comment

If memory serves me correct, since I can't find an image on your website using the "poster" style. It would be the following:

.design-layout-poster .image-title-wrapper {
    display: flex;
    align-items: flex-end;
	justify-content: flex-end;
  }

But again, it's hard to troubleshoot without having a sample in place on your website.

Link to comment
1 hour ago, Wolfsilon said:

If memory serves me correct, since I can't find an image on your website using the "poster" style. It would be the following:

.design-layout-poster .image-title-wrapper {
    display: flex;
    align-items: flex-end;
	justify-content: flex-end;
  }

But again, it's hard to troubleshoot without having a sample in place on your website.

I did put the reference URL at the top, but here it is again if you missed it

https://africanaeconomics.com/diverse-economies-for-youth

I am pretty bad at this. Here's the code i used, but if you click on the above link, only the font is working.

 

<style>
  #block-yui_3_17_2_1_1665680081272_6523
    p { 
  color: white;!important;
  font-family: Optima, sans-serif;!important;
}
    .design-layout-poster .image-title-wrapper {
    display: flex;
    align-items: flex-end;
	justify-content: flex-end;
  }</style>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.