Content hight of a non full-width widget
URL to the page in question:
http://kikoyland.com
-
Below the Intro widget (100%) row, I have 2 widgets split 50/50 in second row.
Both widgets are text-widgets.
In the left one have placed an image and no other Content. (edit -> layout -> Background Image)
In the right I have added text.
The Image is not fully shown (hight) and it seems, that it is related to the amount of text content in the right widget.
I could probably CSS-Hardcode the widgets content hight, but am pretty sure I will lose the responsiveness of the site?
Whats you take on this?
Great question. What I do in the demo’s home page is this. Edit the row with the two widgets in it and look in the layout options there. You’ll find a checkbox to make the widget equal height. Try checking that. It should cause the widget that just has a background image in it to be the same height as the one with content in it.
Let me know if that doesn’t do the trick.
Bill
My apologies Fabian. I had something else in mind when I wrote that reply. Instead of setting the background size to cover, set it to contain. That will force the entire image to always be visible.
With it set to cover, it will always fill the space available and you’re correct in that the height will be set by the content next to it.
Since the image has a white background, you might also set the color of the widget so it has a white background. That way if any letterboxing takes place, it won’t be noticeable.
Let me know how that goes.
- The topic ‘Content hight of a non full-width widget’ is closed to new replies.