Thursday, March 19, 2015

CSS use left, center and right images for border

Create complex borders that requires three images (left, right, center).



Create div with id/class
<div id="border"></div>




#border {
  width: 100%;
  height: 33px
  margin: 0 auto;
  padding: 0;
  text-align: left;
  position: relative;
  margin-top: 0px;
  max-width: 885px;
}


/* Comma separated list of border images */#border 
{
background: url(/images/border-l.jpg) top left no-repeat, url(/images/border-r.jpg) top right no-repeat, url(/images/border-c.jpg) top repeat;
}

No comments: