Twitter Margin Boot 3 lines

Question

I have this simple code from Twitter Bootstrap 3: http://jsfiddle.net/korjavin/xUJGV/3/ .

(result only: http://jsfiddle.net/korjavin/xUJGV/3/embedded/result/ )

I got confused that lines with lorem-lipsum text have no vertical edge.

I can add margin-top to custom.css, but connecting it to all classes, e.g. col-sm-1(2 ..), col-xs-*, col-* ... looks like a bad solution.

What is the best solution to add a vertical margin for all Bootstrap grid classes?

Answer 1

The best solution is to respect Bootstrap rules when nesting elements. A container , inside it is a row , inside it are several col that do not exceed 12 . Then each paragraph is wrapped with a <p> , etc.

Basically, your problem is using Bootstrap elements properly, not CSS.

Check out the improved version of your violin , also in full screen .