Advanced Search

Rounded Corner Boxex - CSS3

/ Published in: CSS
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /*ESTRUCTURA HTML*/
  2. /*
  3. <div>Contenido de la caja</div>
  4. */
  5.  
  6.  
  7. /*---- USANDO IMAGENES -------*/
  8. /*requiere cuatro imagenes, una para cada esquina*/
  9. .box {
  10.     background-image: url(top-left.gif), url(top-right.gif), url(bottom-left.gif), url(bottom-right.gif);
  11.     background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  12.     background-position: top left, top right, bottom left, bottom right;
  13. }
  14.  
  15.  
  16. /*---- SIN IMAGENES ------*/
  17. .box {
  18.     border-radius: 1.6em;
  19. }

URL: http://24ways.org/2006/rounded-corner-boxes-the-css3-way

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.