Why isn't my image centering on Ella 6 theme?

Topic summary

A first-time Shopify user is struggling to center a logo image in the Ella 6 theme’s Custom Image Banner section using the small image option.

Problem:

  • Logo appears left-aligned instead of centered

Attempted solutions:

  1. Added custom CSS targeting .centered-image and .Banner container with flexbox centering properties
  2. Modified settings within the small image configuration

Current status:

  • Issue remains unresolved
  • Community members have requested the store URL and password to investigate
  • One user provided alternative CSS code suggestions focusing on .small-image class with flexbox centering and max-width properties

The discussion is ongoing, awaiting further troubleshooting once access details are shared.

Summarized with AI on November 18. AI used: claude-sonnet-4-5-20250929.

This is my first attempt at creating a website on shopify.

I am using Ella 6 theme

I am trying to add my logo under the header using Custom Image Banner and small image

I have uploaded the logo to small image as item 1

The problem: The image is left aligned.

Resolutions tried:

  1. Added CSS to Custom Image Banner> .container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    max-height: 300px;
    }
    .centered-image {
    width: 25%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    }

  2. Have changed settings in small image trying to center the logo.

Kindly help.

Hey @sudeep11

Kindly share your Store URL and Password if enabled

Hey @sudeep11

.small-image {
  display: flex;
  justify-content: center;
  align-items: center;
}
.small-image img {
  max-width: 100%;
  height: auto;
}

https://ohana-hyderabad.myshopify.com/

password: ohana