Τα περιθώρια και το padding μπορεί να προκαλούν σύγχυση, επειδή, κατά κάποιο τρόπο, φαίνονται το ίδιο πράγμα: λευκός χώρος γύρω από μια εικόνα ή ένα αντικείμενο. Εδώ είναι τι πρέπει να γνωρίζετε ως σχεδιαστής ιστοσελίδων για τις διαφορές τους.
Γέμισμα
Η συμπλήρωση είναι ο χώρος μεταξύ των περιεχομένων μιας εικόνας ή κελιού και του εξωτερικού της περιγράμματος. Στην παρακάτω εικόνα, η γέμιση είναι η κίτρινη περιοχή γύρω από το περιεχόμενο. Σε αυτήν την περίπτωση, η επένδυση περιστρέφεται πλήρως γύρω από τα περιεχόμενα: επάνω, κάτω, δεξιά και αριστερή πλευρά. Μπορείτε να καθορίσετε πόση επένδυση (σε ποσοστό, pixel, σημεία κ.λπ.) για κάθε πλευρά και δεν χρειάζεται να είναι ίδια. Με αυτόν τον τρόπο, μπορείτε να τοποθετήσετε περιεχόμενο σε ένα στοιχείο.
Περιθώρια
Αντίθετα, τα περιθώρια είναι τα κενά έξω από τα όρια ενός στοιχείου, μεταξύ του στοιχείου και ό,τι βρίσκεται δίπλα του. Στην εικόνα, το περιθώριο είναι η λευκή περιοχή έξω από ολόκληρο το αντικείμενο. Όπως και η επένδυση, το περιθώριο περιστρέφεται πλήρως τα περιεχόμενα σε αυτό το παράδειγμα: στην επάνω, κάτω, δεξιά και αριστερή πλευρά. Μπορείτε να χρησιμοποιήσετε τα περιθώρια για να τοποθετήσετε div και άλλα στοιχεία σε μια σελίδα.
Δοκιμάζετε πάντα τις σελίδες σας σε διάφορα προγράμματα περιήγησης, λειτουργικά συστήματα (συμπεριλαμβανομένων των κινητών) και μεγέθη οθόνης για να βεβαιωθείτε ότι εμφανίζονται ακριβώς όπως θέλετε.
