css Blog Summary not centered?

Site URL: https://dralicepickering.squarespace.com

Does anyone have any ideas as to why the blog section is not perfectly centered? For some reason it suddenly shifted over to the left side a bit. Should this be CSS coded back in or would something else be causing this?

Thank you!

Hi @Steph1249

Where you able to solve this? Blog looks perfectly centered. If not, please send a screenshot of what you're seeing.

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. 🙂 

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.

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!

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?

On 2/21/2022 at 1:44 AM, tuanphan said:

Have you solved this yet?

Hi @tuanphan. Not yet unfortunately