0

I need to create a full height divider without breaking Bootstrap CSS grid layout because I might need to make the right column to be wrapped and go after the left column for some screen sizes.

Here is an image which shows the issue: enter image description here

And here is a Bootply sandbox to play with.

My question differs from other questions about making the column 100% high. Although I have implemented the divider as a border of the right column, this is not mandatory - I don't care about the height of the right column, it might be left as it is, and the divider could as well be a separate HTML element. I need only the divider to be 100% high and not entire column.

Is there any way to create this red vertical divider while keeping Bootstrap grid layout intact to preserve responsive design?

JustAMartin
  • 13,165
  • 18
  • 99
  • 183
  • possible duplicate of [How to make bootstrap column height to 100% row height?](http://stackoverflow.com/questions/25213171/how-to-make-bootstrap-column-height-to-100-row-height) – HDP Sep 22 '15 at 05:34
  • This question is a bit way different - I don't want entire column to be 100% high, I only need that border, no matter how and where it is drawn. It might as well be a separate HTML element - if it works, then it's fine for me. And solutions in other questions involve creating workarounds which might cause other complications later. I edited my question to explain this. – JustAMartin Sep 22 '15 at 07:38

0 Answers0