# Remove Padding around the image module

**URL:** <https://community.hubspot.com/t/remove-padding-around-the-image-module/39944>\
**Category:** CMS Development\
**Created:** [June 30, 2021, 1:53pm UTC](https://community.hubspot.com/t/remove-padding-around-the-image-module/39944 "2021-06-30T13:53:25Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![SlimSr2003](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/slimsr2003/32/73373_2.png) [@SlimSr2003](https://community.hubspot.com/u/SlimSr2003)\
**Post date:** [June 30, 2021, 1:53pm UTC](https://community.hubspot.com/t/remove-padding-around-the-image-module/39944/1 "2021-06-30T13:53:25Z")

</div>

I have created this page: [https://info.yeshealth.com/hta](https://info.yeshealth.com/hta) and I have used an Image module grouped with a rich text module to make a row. I have used the code blow my signiture to center the text and the image module in the row. The issue I am having is that the image(s) have padding/margins around them and I would like them to go to the edge of the page and ideally fill the area on that side of the row.

Any thoughts?

Thanks

Scott

Code used to center Text and Image in Row:

.rowVertcenter \> .row-fluid-wrapper \> .row-fluid {  
display: flex;  
}  
.textVertcenter\>div {  
display: flex !important;  
align-items: center;  
justify-content: center;  
height: 100%;  
}  
.textVertcenter\>div\>span {  
width: 90%;  
height: 100%;  
display: flex;  
flex-direction: column;  
justify-content: center;  
}  
[@media](https://community.hubspot.com/t5/user/viewprofilepage/user-id/83477) (max-width: 768px) {  
.rowVertcenter \> .row-fluid-wrapper \> .row-fluid {  
flex-direction: column;  
}  
/\* If you want to re-order the text so it’s above the images on mobile add this \*/  
.rowVertcenter \> .row-fluid-wrapper \> .row-fluid \> .span6:not(.textVertcenter) {  
order: 2;  
}

---

<div class="post-metadata">

**Author:** ![piersg](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/piersg/32/99782_2.png) [@piersg](https://community.hubspot.com/u/piersg)\
**Post date:** [June 30, 2021, 3:42pm UTC](https://community.hubspot.com/t/remove-padding-around-the-image-module/39944/2 "2021-06-30T15:42:42Z")

</div>

Your spans wrapping the images has a width of 90%. You need to change that to 100%

```lia-code-sample
.textVertcenter>div>span {
 /*width: 90%;*/
 width: 100%;
 height: 100%;
 display: flex;
 flex-direction: column;
 justify-content: center;
}

```

---

<div class="post-metadata">

**Author:** ![SlimSr2003](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/slimsr2003/32/73373_2.png) [@SlimSr2003](https://community.hubspot.com/u/SlimSr2003)\
**Post date:** [June 30, 2021, 6:02pm UTC](https://community.hubspot.com/t/remove-padding-around-the-image-module/39944/3 "2021-06-30T18:02:57Z")

</div>

Piersg,

Thank you that fixed it. Simple solution!

Scott
