Home>Support>Hero height and width settings

Hero height and width settings

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hello,

Thank you so much again for the incredible tools you are providing! I am trying to understand how to set the parameters for Height and maximum width for the Hero Image. The default parameter for height is blank, and for width I have to choose only the maximum width value. I have tried countless combinations of with and height values, but always the images get distorted and croped or over stretched. I am trying to get the Hero Image to display a full image slider (not full screen), I want my images in the frames of the Hero to be displayed fully, not cropped or stretched. Any help will be greatly apreciated! Thank you again!

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 11 months ago Alex S
    Hi, I Work Here

    Hi Mihaela,

    Thank you for the kind words! :)

    Okay so CSS backgrounds are a complicated beast. Basically, no matter what, they will maintain aspect ratio at all costs even if it means cropping the image. This isn’t something you can avoid. :( The ideal method of avoiding this is typically not set a height (as that will allow the content area of the hero widget to resize and reduce the aspect ratio that needs to be maintained)

    To clarify, the height setting will set a static height which if not applied will allow the hero widget to resize depending on contents size. Container width will allow the hero to have a dynamic width (to a point). The former typically causes problems due to very large amounts being used. (300×900 for example, which is 1:3 and is a very awkward aspect ratio to maintain)

    Do you have a public URL where we can take a look at your hero widget? This will allow me to get a better idea of what you’re trying to use so that I can provide a better answer. If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More