Bento Hero Image cuts of heads

  • Hi there!

    Proudly creating my own website, using the Bento theme. My first draft contained a header, which needed a title (or button) to work well. I found out I could use the Hero widget, because I wanted to get rid of the title. It took some fiddling, but the Hero image replaces the header now.

    There is only one problem: the heads of the people in the picture are shaved off, whilst there is almost a centimeter grass beneath their feet. When the header was just a header (and no Hero widget), it took much better proportions. (This is still visible in the english version – click English).

    How do I get my Hero widget to work as nicely as the original header did?

    With greetings from the Netherlands, Annemieke

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You can’t really, if it worked before it would have only been at one certain resolution size. The only proper way to resolve this is to use a different image at certain resolution sizes, avoid absolute CSS positioning on the image, choose a focus point on each image (that is loaded on different resolutions) and implement the outcome using the <picture> element.

    In summary, use a decorative image instead that does not require a focal point.

    Thread Starter annemieke67

    (@annemieke67)

    Hi Andrew,

    Thank you for your answer, although it is extremely frustrating. I bought this picture, it is important to me. I fiddled around a little bit with resolution and pixels, and now it is somewhat better. But not half as good as in the original header!

    How do I avoid absolute CSS positioning?
    How do I choose a focus point on an image?
    What do you mean by implementing the outcome using the picture element?

    Maybe I can try to adapt the picture in Gimp and then implement it again.
    Thank you for helping me find new ways of solving this, I am determined to get it done!

    Vriendelijke groet,
    Annemieke

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Bento Hero Image cuts of heads’ is closed to new replies.