I’m curious if there is a method using css borders to create a vertical line between grid columns which runs 100% of the browser height?
Here is reference example, however this website is using a background image instead.
If there is not a solution to this, could someone please suggest a method using the background image that can act responsive? Thank You.
There is using the flexbox property but that is so new that browser support is strictly limited to the latest versions only (IE10 / Chrome 23 /FF17) AFAIK.
You can fake it with faux columns but that’s the only way.
Think this could do the trick perhaps…
Does that work on a responsive site?
@NSR About the only solution that is vaguely responsive is to use a background gradient color to fake a column.
Ya im finding some difficulties with this for sure. How would the BG gradient work exactly?
I’m essentially trying to add a 100% height line in the columns of this code pen grid example…
You just have to define a gradient with color stops in the right place.
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".