March 27, 2012
How to make recessed button in CSS
Question by CodeDevelopr
In the image below, the top image is what I currently have on a site, it uses an actual Image.
What I want to do is make something more like the bottom image using pure CSS, I cannot figure out how to do it though, can anyone help?
Answer by theJollySin
CSS3 has a lot of solutions. Try this:
div.exampleboxshadowj {
background-color: #EEE;
float: left;
margin-top: 20px;
margin-right: 40px;
height: 65px;
width: 160px;
text-align: center;
-webkit-box-shadow: inset -5px -5px 5px 5px#888;
box-shadow: inset -5px -5px 5px 5px #888;
}
Though you can change the color to blue, if you want.
Here is a great link for all the info you could want.
