the answer for all question about Oxygen Builder plugin and WordPress

Hello dear people. I need a bit of assistance, if possible…


Hello dear people. I need a bit of assistance, if possible…
So here I have this div with two divs inside of it, and I would like the height of the div containing the image to adapt to the actual height of the div that contains the text.
As of now, the image stretches the div as large as it can, since it’s limited by it’s width, but I want the text div to dictate how tall the overall thing can be, so that the image is never bigger than the text. If that makes sense…
Thanks in advance!!




Source

Checkout Woo Design Set

Whistle Design Set

4 Comments
  1. Sridhar says

    One way is to make the image’s position as absolute so it gets taken out of the flow essentially and does not take up any height. Set the parent div’s position to relative.

  2. Briany says

    Use stretch on the container to ensure both divs are the same height. Add padding-top:100% to the left div. Make your image position:absolute;height:100%;width:100%

    Pretty sure that will work provided the image itself is square.

  3. André says

    That’s actually a pretty complicated (if not impossible) requirement. If the text grows the image has to grow. Since you probably want the image to keep the correct aspect ratio it not only has to grow in height but also in width. Which means the text’s width has to shrink. Which means the text’s height will grow. Which means the image has to grow. And so on…

    I personally think there have to be some limitations to the image’s width / height.

  4. Rasel says

    Container{
    display:table-row;
    }
    Container-childs{display:table-cell;}
    This will ensure both div and its content has same height..also image needs to be set height:100%;

    When they breaks into column in mobile or tablet viee,Please display the container and child flex also set the height of the image when it breaks into columns…

Leave A Reply

Your email address will not be published.

Oxyrealm Docs OxyMade - Oxygen Builder Design Set Mega collection