Sunday 30 December 2012

Creating differenet shapes in CSS 3

,

Square :

#square {
    width: 100px;
    height: 100px;
    background: orange;
}

Rectangle :

#rectangle { 
    width: 200px; 
    height: 100px; 
    background: orange; 
}

Circle :

#circle { 
    width: 100px; 
    height: 100px; 
    background: orange; 
    -moz-border-radius: 50px; 
    -webkit-border-radius: 50px; 
    border-radius: 50px; 
}

Oval :

#oval { 
    width: 200px;
    height: 100px;
    background: orange;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 50px;
    border-radius: 100px / 50px; 
}

0 comments to “Creating differenet shapes in CSS 3”

Post a Comment