Jump to content

how to center a markdown block?

Recommended Posts

Site URL: https://www.lulucheng.com/writing

i added a markdown block so i could embed an email signup form for my Substack newsletter. this is the html code i received from Substack to do that:

<iframe src="https://lulu.substack.com/embed" width="480" height="320" style="border:1px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>

however, when i paste this code into the markdown block editor, it left aligns the signup form (white box below the 'sign up' button):

1549205491_Screenshot2020-04-1809_06_06.thumb.png.c750f70136ae8fa815d661ff9c628bf9.png

how do i center the signup form on the page? i'm using the sofia template. 

thanks for any help or insight!

p.s. i removed the markdown block from https://www.lulucheng.com/writing for now, but the screenshot i've attached shows the issue i'm describing.

Link to comment
  • Replies 7
  • Views 4.5k
  • Created
  • Last Reply
10 hours ago, derricksrandomviews said:

There is no code, just edit a page and add a spacer, just as you would add a text block or image block,  to the page and use it to move the markdown block. You will need to put the markdown block back up first of course. 

https://support.squarespace.com/hc/en-us/articles/206566717-Spacer-Blocks

ah, i see. i added a spacer on either side, but it's still not centered. it's more obvious on mobile:

IMG_4673.thumb.PNG.f62a0ebf93c2414351f268e853d6f205.PNG

i think the problem is that the signup module itself is left aligned in the markdown block. and no matter how i resize the spacers on either side, i can't get it quite centered. is there a way to center the signup module within the markdown block (maybe using code)? 

Link to comment
  • 3 months later...
  • 1 month later...
On 4/18/2020 at 12:07 PM, skiptomylu211 said:

Site URL: https://www.lulucheng.com/writing

i added a markdown block so i could embed an email signup form for my Substack newsletter. this is the html code i received from Substack to do that:

<iframe src="https://lulu.substack.com/embed" width="480" height="320" style="border:1px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>

however, when i paste this code into the markdown block editor, it left aligns the signup form (white box below the 'sign up' button):

1549205491_Screenshot2020-04-1809_06_06.thumb.png.c750f70136ae8fa815d661ff9c628bf9.png

how do i center the signup form on the page? i'm using the sofia template. 

thanks for any help or insight!

p.s. i removed the markdown block from https://www.lulucheng.com/writing for now, but the screenshot i've attached shows the issue i'm describing.

<center><all other styling> Your Content <all other styling></center>

Add an additional center tag on top of your content and styling.

center.png

left aligned.png

Link to comment
24 minutes ago, MarkeGroup said:

Add an additional center tag on top of your content and styling.

Hi,
Please do not use <center> tag! It's outdated!

https://www.w3schools.com/tags/tag_center.asp

 

Instead of it you can make it center via CSS easily! @LuxNarayan @skiptomylu211

Please use the like button if it helps you!

Best,
Leopold

Ninja Kit Extension: Upgrade your Squarespace website without coding.

YouTube Preview    -    FREE DOWNLOAD

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.