Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Custom CSS to center Summary Block is juuust off center


Vanec

Question

Site URL: https://www.viperequitypartners.com/

Hello,

I added custom CSS to center the contents of the Summary Block (in Grid view) and it's off-center. Any ideas what's going wrong? See screenshot and code below. Thank you!

//center summary block, unlink from bios//
.sqs-gallery-design-autogrid .summary-item-list {

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  
 pointer-events: none;

}

 

bottom row off center.png

Link to post
  • Answers 6
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

You left your code in, correct? Here's how it looks on mine with the addition of the code I supplied above:  

@rwp You're right, they both work! I had deleted the old code which was the problem. Thanks!

Posted Images

6 answers to this question

Recommended Posts

  • 1
.summary-item-list.sqs-gallery.sqs-gallery-design-autogrid > * {
    margin-right: auto !important;
    margin-left: auto !important;
}

This should fix the spacing on the text blocks below too.

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Link to post
  • 1

This should do the same thing, but give it a try if the other one isn't working.

.sqs-gallery-design-autogrid .summary-item-list > * {
    margin-right: auto !important;
    margin-left: auto !important;
}

 

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Link to post
  • 0
6 minutes ago, rwp said:

.summary-item-list.sqs-gallery.sqs-gallery-design-autogrid > * {
    margin-right: auto !important;
    margin-left: auto !important;
}

This should fix the spacing on the text blocks below too.

Didn't work: 

 

didntwork.png

Link to post
  • 0

You left your code in, correct?

Here's how it looks on mine with the addition of the code I supplied above:

 

Screen Shot 2020-07-02 at 16.16.49.png

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Link to post
  • 0

@Vanec When you make your "Our Team" did you do that all from custom code or did you use a template within Squarespace. Trying to create a similar vibe but with square photos.

 

Thanks!

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...