Έχουμε δημιουργήσει την εμφάνιση ενός κουμπιού στην κανονική του κατάσταση, αλλά ένα κουμπί 3D όπως αυτό επαινεί μια κατάσταση "ώθησης". Αυτό που κάνουμε είναι να προσθέσουμε ένα πιο σκούρο χρώμα στο κουμπί :hoverκαι :focus. Στη συνέχεια, για :active(ώθηση), αφαιρούμε μερικά από τα box-shadows και τα πιέζουμε προς τα κάτω και προς τα δεξιά με σχετική θέση. Είναι τόσο απλό, το κουμπί έχει τώρα μια πραγματικά προφανή και ικανοποιητική εμπειρία όταν κάνετε κλικ σε αυτό.
Αυτό που θυμίζει: όταν προσαρμόζετε τη σχετική τοποθέτηση με τιμές πάνω / αριστερά / κάτω / δεξιά όπως αυτή, θα πρέπει να είστε προσεκτικοί στο μέλλον εάν πρέπει να τοποθετήσετε απόλυτα το στοιχείο. Ίσως να κάνετε τρελά άλματα, καθώς η κορυφή / αριστερά / κάτω / δεξιά σημαίνει κάτι πολύ διαφορετικό με την απόλυτη τοποθέτηση από ό, τι με τη σχετική τοποθέτηση.