I am using rows and columns to layout a page in to sections - which works fine. What I am struggling with is "drawing" separators between my sections. At first I assumed I could just add a border - which I can - but I don't want them to be tightly up against each other. If I play with the margins or padding it seems to cause the columns to wrap around.
I followed a video linked int he forums to add vertical left borders between columns which works well, the separator was 100% in height so I increased the margin between my rows to get separation which again seems to work well. Following this I've been trying to do the same but with horizontal separators. While a similar approach works the left and bottom borders then meet whereas I wanted them to more float.
.my-bottom-border {
border-bottom: 2px solid red;
}
Any suggestions on how to get workable borders within each column to make sections or even better separators between them but not the entire height/width?