Centering an Image - Nothing I can find online is working

[Imagination1]

I’m using the image with text section and removing the text to display the image. Then resizing with custom CSS, but no matter what I do I can’t get the image to center!

SITE LINK

Hoping that somebody can help?

Thank you!

[suyash1]

@Imagination1 - I think you have solved your issue, site is looking ok now

[Transcy]

Hello @Imagination1 ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Assets folder → base.css file or theme.css file

Add this following code at the bottom of page

.image-with-text-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.text-section {
  margin-bottom: 20px;
}

Save and preview

Hope this can help.

Transcy

[Imagination1]

Thank you!

One other issue that I’m having is removing the white space between sections, setting margins and padding to 0 isn’t having any impact. Really appreciate if you have any ideas!

[suyash1]

@Imagination1 - this space?

[Imagination1]

Yep, the space between the form and text above/below.

And then between these two sections as well.

[suyash1]

@Imagination1 - add this css to the very end of your theme.scss file and check

@media screen and (max-width:749px){
#survey-says .rich-text {padding: 10px 0;}
#survey-says .custom-html-section--padding {padding: 10px 0;}
}