# How to adjust display of blog posts with a big post on top and 2 column posts under

**URL:** <https://community.elfsight.com/t/how-to-adjust-display-of-blog-posts-with-a-big-post-on-top-and-2-column-posts-under/65339>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [August 11, 2024, 10:41pm UTC](https://community.elfsight.com/t/how-to-adjust-display-of-blog-posts-with-a-big-post-on-top-and-2-column-posts-under/65339 "2024-08-11T22:41:36Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [August 11, 2024, 10:41pm UTC](https://community.elfsight.com/t/how-to-adjust-display-of-blog-posts-with-a-big-post-on-top-and-2-column-posts-under/65339/1 "2024-08-11T22:41:36Z")

</div>

If you want to change blog page layout to this on Squarespace.

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/d/5/d5ffee9ab9193fab46338194e84666790fbfafdb.jpeg)

You can use this code to Custom CSS box.

```auto
/* Blog Page layout */
.blog-basic-grid .blog-basic-grid--container:first-child {
grid-column: ~"1 / 3";
}

```

If you want to apply this for a specific blog page, you can **[find the Blog Page ID](https://community.elfsight.com/t/how-to-find-id-in-squarespace/65340)**.  
In my example, we will have:

- #collection-6677756d03a4f15ba27ce9d8

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/7/b/7b1634b4a1577a88238c25024d55449802aa81a2.png)

Next, use this CSS code

```auto
#collection-6677756d03a4f15ba27ce9d8 .blog-basic-grid--container:first-child {
    grid-column: ~"1 / 3";
}

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/5/2/522d76a8435fb28672fb12aabcd1ef8f5c65c3bb.png)
