We hebben het uiterlijk van een knop in zijn normale staat gecreëerd, maar zo'n 3D-knop smeekt om een "ingedrukte" staat. Wat we doen is een donkerdere kleur toevoegen aan de knop op :hoveren :focus. Vervolgens voor :active(geduwd), verwijderen we een aantal van de box-shadows en duwen deze naar beneden en naar rechts met relatieve positionering. Het is zo simpel als dat, de knop heeft nu een heel duidelijke en bevredigende ervaring wanneer je erop klikt.
Een die in me opkomt: als je de relatieve positionering zo aanpast met waarden boven / links / onder / rechts, moet je in de toekomst voorzichtig zijn als je het element absoluut moet positioneren. Je zou een aantal gekke sprongen kunnen maken, aangezien boven / links / onder / rechts iets heel anders betekent met absolute positionering dan met relatieve positionering.