On one of my pages, I have a pair of columns. The second column has a background image that’s intended to fill the whole height of the page body. However, it looks like this even though it’s set to fill 100% height of its container.
From the screenshot, you can clearly see that the row which parents the column goes across the full height of the page’s body. However, the column itself only fills about 90% of that width. Why is this?
Edit: Why should you use flexbox: Because the left column has height: auto you will want to have the right column have the same height as the height auto of the left column. Since the right column doesn’t have the same content in it as the left column you can’t just set it to height auto just like the left column. In these situations flexbox can be really helpful.