# Vertically align images in row

**URL:** <https://community.hubspot.com/t/vertically-align-images-in-row/12127>\
**Category:** CMS Development\
**Created:** [December 27, 2018, 2:18am UTC](https://community.hubspot.com/t/vertically-align-images-in-row/12127 "2018-12-27T02:18:05Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![janabarrett](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/janabarrett/32/21752_2.png) [@janabarrett](https://community.hubspot.com/u/janabarrett)\
**Post date:** [December 27, 2018, 2:18am UTC](https://community.hubspot.com/t/vertically-align-images-in-row/12127/1 "2018-12-27T02:18:05Z")

</div>

I’m new at HubSpot templates and trying to figure out how to center-align instead of top-align these logos.

 ![Screen Shot 2018-12-26 at 6.15.55 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/7/47cc8a69b07e5595d36b199d37e37e8174fe7ecb.png)  
I’ve tried playing around with flex boxes but don’t quite know what I’m doing. Any help would be appreciated. Here’s the page I’m working on: [https://info.honeycomb.io/test-lp](https://info.honeycomb.io/test-lp)

---

<div class="post-metadata">

**Author:** ![jzilch](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jzilch/32/2867_2.png) [@jzilch](https://community.hubspot.com/u/jzilch)\
**Post date:** [December 28, 2018, 4:10pm UTC](https://community.hubspot.com/t/vertically-align-images-in-row/12127/2 "2018-12-28T16:10:30Z")

</div>

@janabarrett When I am vertically aligning items such as these I like to use Flexbox as it has a pretty good browser support and should be more performant than trying to use absolute positioning as that will cause a browser re-paint. I took a look at the structure and you should be able to add display flex to the parent of these images and then set the align-items attribute to center. That implementation would look something like the following.

```auto
..container.logo-tile-wrapper div.row-fluid {
 display: flex;
 align-items: center;
}

```

I would also suggest removing the period from the beginning of the class name. When adding names to the classes added to a module you don’t need to add a period at the front of the class name.

---

<div class="post-metadata">

**Author:** ![janabarrett](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/janabarrett/32/21752_2.png) [@janabarrett](https://community.hubspot.com/u/janabarrett)\
**Post date:** [January 4, 2019, 7:06pm UTC](https://community.hubspot.com/t/vertically-align-images-in-row/12127/3 "2019-01-04T19:06:06Z")

</div>

Brilliant! Thanks so much @jzilch - that solved it for me 🙂
