Jump to content

Blog Summary not centered?

Recommended Posts

  • Replies 6
  • Views 371
  • Created
  • Last Reply

Top Posters In This Topic

Hi @meganheath

Unfortunately not. It's really minor, but my client did bring it to my attention so I'd like to get it better centered here. The mobile seems fine, but desktop is where it looks slightly shifted over to the left side. Again, a minor shift, but since it was brought to my attention I'd like to get it squared away. 🙂 

1806438151_ScreenShot2022-02-14at12_55_41PM.thumb.png.cae25b58b29355b16e8590dd802ea73f.png

Link to comment

Hi @Steph1249

The reason your summary block is not centre is because there is a margin on the right of each thumbnail. Have you added custom CSS to style the summary block? This is what is causing the issue...

@media screen and (min-width: 992px){

	div#block-yui_3_17_2_1_1620192787467_18304 .summary-item {
    	width: 22.4981% !important;
    	margin-bottom: 3.33592% !important;
    	clear: none !important;
    	margin-right: 2.5019% !important; 
	}
}

If you have, then remove this CSS.

Then select Size and Spacing at the bottom of the Summary block editor and adjust the column width and gutter to position 4 thumbnails in a row. 

Hope this helps.

Link to comment
On 2/15/2022 at 2:30 AM, meganheath said:

Hi @Steph1249

The reason your summary block is not centre is because there is a margin on the right of each thumbnail. Have you added custom CSS to style the summary block? This is what is causing the issue...

@media screen and (min-width: 992px){

	div#block-yui_3_17_2_1_1620192787467_18304 .summary-item {
    	width: 22.4981% !important;
    	margin-bottom: 3.33592% !important;
    	clear: none !important;
    	margin-right: 2.5019% !important; 
	}
}

If you have, then remove this CSS.

Then select Size and Spacing at the bottom of the Summary block editor and adjust the column width and gutter to position 4 thumbnails in a row. 

Hope this helps.

Thanks @meganheath! So that piece was added in order to keep the section 2 or 4 columns in the weird in between size that creates 3 columns with a widow item on the second row. Is there a better way to do that that would keep it centered at all sizes? Appreciate it!

Link to comment
On 2/17/2022 at 8:38 PM, Steph1249 said:

 So that piece was added in order to keep the section 2 or 4 columns in the weird in between size that creates 3 columns with a widow item on the second row. Is there a better way to do that that would keep it centered at all sizes? Appreciate it!

Have you solved this yet?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 2 weeks later...

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.