Can I reduce the image height in cover block (change aspect ratio)?

  • Problem with cover block.

    If I use an image with aspect ratio 2:1 in 1 cover block it shows in a good way (continue to have aspect ratio 2:1).
    If I have 2 cover blocks side by side the images shows in aspect ratio 1:1.
    I would like them to show up (side by side) with aspect ratio 2:1.
    This image explains the problem:
    https://ibb.co/58GSrsk

    The problem seems like the image height in the cover block is fixed.
    Is there a way to reduce the image height?

    Site: https://ibb.co/Jd0tKJ8

Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter boppar

    (@boppar)

    No matter how I change the minimum height, the aspect ratio doesn’t become as I want.

    Hi @boppar, by clicking on the cover block, going inside the ellipis menu and choosing show more settings, you can open the additional settings panel.

    There you can change the aspect ratio of the blocks by changing the minimum height of cover and also apply custom classes that you can style with CSS. Hopefully that should enable you to set the aspect ratio of the images as per your convenience.

    Also, please note that if you have two cover blocks in two side-by-side columns, you’ll have to set the minimum height for both cover blocks, not just one… else both will take the height of the higher one. And the height of the text in the cover block (if any) should also not exceed the configured minimum height. After all, this is “minimum height” — not height or maximum height.

    Here’s a screenshot to show you what you’re asking for is possible and can easily be configured with the minimum height attribute:

    Thread Starter boppar

    (@boppar)

    @dhruvkb, thanks for your answer.
    I know about those settings.
    No matter what minimum height I set, it changes the aspect ration when it’s 1 cover block, but when it’s 2 cover blocks side by side, the aspect ratio continues the same.

    Thread Starter boppar

    (@boppar)

    Hi @gappiah

    Thank you for your good advices.

    My problem is that I want both a button and text in the cover block. This makes the height to grow, meaning the aspect ratio changes.

    This shows the difference using a button and text or just a button.
    https://ibb.co/B6b9zv0

    Three questions:
    1. Is there a way to add text without the height grows?
    2. Is there a way to change the text font used in just one coverblock?
    3. Is itt possible to have the text in the top and button in the bottom of the cover image? Like this:
    https://ibb.co/1MD37JR

    • This reply was modified 3 years, 11 months ago by boppar.
    Thread Starter boppar

    (@boppar)

    Regarding having the content of a cover block in the top or the bottom.
    I tried these codes.

    .wp-block-cover__inner-container {
    align-self:end;
    }

    .wp-block-cover__inner-container {
    align-self:start;
    }

    Unfortunately nothing changed. Any ideas?

    Thread Starter boppar

    (@boppar)

    If somebody cares to help the current url is:
    https://ibb.co/z70ZhS3

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Can I reduce the image height in cover block (change aspect ratio)?’ is closed to new replies.