Feb 6, 2015 - CSS, LESS    Comments Off on Vertical lines in the background

Vertical lines in the background

adam. urg.

/* Centered Vertical Line - using CSS3 gradients */
.centered-vert-line(@midColor: #ccc, @width: 1px, @startColor: transparent, @endColor: transparent, @deg: 90deg) {
  background-image: -moz-linear-gradient(@deg, @startColor, @midColor, @endColor); // FF 3.6+
  background-image: -webkit-linear-gradient(@deg, @startColor, @midColor, @endColor); // Safari 5.1+, Chrome 10+
  background-image: -o-linear-gradient(@deg, @startColor, @midColor, @endColor); // Opera 11.10
  background-image: linear-gradient(@deg, @startColor, @midColor, @endColor); // Standard, IE10
  background-position: 50%;
  background-repeat: repeat-y;
  background-size: @width 100px;
 }

Comments are closed.