.text_display { font-size: 12px; font-weight: bold; font-family: Georgia, Times New Roman, serif; color: #3d85c6; display:list-item; float:left; margin:10px; width:100%; line-height: 15px; } .linear_grad { width: 120px; height: 120px; /* Linear gradient example with various browser support */ background: -webkit-repeating-linear-gradient( -90deg, red, green 20px, blue 21px); background: -moz-repeating-linear-gradient( -90deg,red, green 20px, blue 21px); background: -o-repeating-linear-gradient( -90deg, red, green 20px, blue 21px); background: repeating-linear-gradient( -90deg, red, green 20px, blue 21px); background-size: 100% 21px; margin:10px; display:list-item; float:left; }
<div class="text_display"> Linear Gradient <br /> <code> background: -webkit-repeating-linear-gradient( -90deg, red, green 20px, blue 21px); <br /> background: -moz-repeating-linear-gradient( -90deg,red, green 20px, blue 21px); <br /> background: -o-repeating-linear-gradient( -90deg, red, green 20px, blue 21px); <br /> background: repeating-linear-gradient( -90deg, red, green 20px, blue 21px); <br /> background-size: 100%; </code> </div> <br /> <div class="linear_grad"> </div>