Τιμές ύψους. CSS Πλάτος και ρυθμίσεις ύψους για τη ρύθμιση των μεγεθών των σελίδων HTML. Δημιουργία ενός μπλοκ με ύψος που έχει ένα ορισμένο ποσοστό του πλάτους του

Είναι 1000 * 0,75 \u003d 750 pixels. Εάν ο χρήστης αλλάξει το μέγεθος του παραθύρου του προγράμματος περιήγησης, το πλάτος του στοιχείου σώματος και, κατά συνέπεια, το πλάτος του ενσωματωμένου μπλοκ DIV θα αλλάξει επίσης.

Ποσοστιαίες τιμές για το ύψος της ιδιοκτησίας που σχετίζονται με την ιδιότητα πλάτους, μόνο τώρα το ύψος υπολογίζεται στο ύψος του στοιχείου δοχείου.

Για παράδειγμα:

Ταυτόχρονα, τα πραγματικά μεγέθη του στοιχείου μπορεί τελικά να διαφέρουν από εκείνους που είναι εγκατεστημένοι στις ιδιότητες του πλάτους και του ύψους. Για παράδειγμα:

Όπως μπορεί να φανεί στο στιγμιότυπο οθόνης, στην πραγματικότητα, η αξία του πλάτους - 200px ιδιοκτησίας - καθορίζει μόνο το πλάτος του εσωτερικού περιεχομένου του στοιχείου και το χώρο του οποίου είναι το πλάτος του οποίου είναι ίσο με το εσωτερικό πλάτος περιεχομένου ( Πλάτος ακινήτου) + Εσωτερικές ενδείξεις (ιδιότητα Padding) + πλάτος των συνόρων (ιδιοκτησία πλαισίου συνόρων) + εξωτερικές ενδείξεις (περιθώριο περιθωρίου). Δηλαδή, το στοιχείο θα έχει πλάτος 230 εικονοστοιχείων και το πλάτος του μπλοκ στοιχείου, λαμβάνοντας υπόψη τις εξωτερικές περιπτώσεις, θα είναι 250 pixels.

Παρόμοιοι υπολογισμοί πρέπει να λαμβάνονται υπόψη κατά τον καθορισμό του μεγέθους των στοιχείων.

Μέσω Επιπλέον σύνολο Οι ιδιότητες μπορούν να εγκατασταθούν ελάχιστες και μέγιστες διαστάσεις:

min-Width: Ελάχιστο πλάτος

Μέγιστο πλάτος: Μέγιστο πλάτος

min-Ύψος: Ελάχιστο ύψος

Μέγιστο ύψος: Μέγιστο ύψος

Min-πλάτος: 200px; Πλάτος: 50%. Μέγιστο πλάτος: 300px;

Σε αυτή την περίπτωση, το πλάτος του στοιχείου είναι το 50% του πλάτους του περιέκτη στοιχείων, αλλά δεν μπορεί να είναι μικρότερο από 200 εικονοστοιχεία και περισσότερα από 300 εικονοστοιχεία.

Παράκαμψη πλάτους μπλοκ

Η ιδιότητα μεγέθους κουτιού σας επιτρέπει να υπερισχύσετε τις εγκατεστημένες διαστάσεις των στοιχείων. Μπορεί να λάβει μία από τις ακόλουθες τιμές:

Περιεχόμενο-πλαίσιο: Η προεπιλεγμένη τιμή ιδιοκτησίας στην οποία το πρόγραμμα περιήγησης για τον προσδιορισμό των πραγματικών πλάτη και το ύψος των στοιχείων προσθέτει στις τιμές των τιμών πλάτους και ύψους και εσωτερικών εσοχών

padding-Box: Υποδεικνύει το πρόγραμμα περιήγησης στο Web ότι το πλάτος και το ύψος του στοιχείου πρέπει να περιλαμβάνει εσωτερικές ενδείξεις ως μέρος της αξίας του. Για παράδειγμα, ας έχουμε το ακόλουθο στυλ:

Πλάτος: 200px; Ύψος: 100px; Περιθώριο: 10px; Padding: 10px; Σύνορα: 5px στερεό #ccc; Ιστορικό-χρώμα: #EEEE; Κουτί-μέγεθος: Padding-box?

Εδώ, το πραγματικό πλάτος του εσωτερικού περιεχομένου του μπλοκ θα είναι ίσο με το 200px (πλάτος) - 10px (αριστερά) - 10px (επένδυση-δεξιά) \u003d 180px.

Αξίζει να σημειωθεί ότι τα περισσότερα μοντέρνα προγράμματα περιήγησης δεν υποστηρίζουν αυτή την ιδιοκτησία.

border Box: Καθορίζει το πρόγραμμα περιήγησης ιστού που το πλάτος και το ύψος του στοιχείου πρέπει να περιλαμβάνει εσωτερικές περιπτώσεις και όρια ως μέρος της αξίας του. Για παράδειγμα, ας έχουμε το ακόλουθο στυλ:

Πλάτος: 200px; Ύψος: 100px; Περιθώριο: 10px; Padding: 10px; Σύνορα: 5px στερεό #ccc; Ιστορικό-χρώμα: #EEEE; Κουτί-μέγεθος: Σύνορα.

Εδώ το πραγματικό πλάτος του εσωτερικού περιεχομένου του μπλοκ θα είναι ίσο με το 200px (πλάτος) - 10px (αριστερά) - 10px (επένδυση-δεξιά) - 5px (όριο-αριστερό πλάτος) - 5px (πλάτος των συνόρων ) \u003d 170px.

Για παράδειγμα, ορίζουμε δύο μπλοκ που διαφέρουν μόνο με την τιμή της ιδιότητας μεγέθους κουτιού:

Στην πρώτη περίπτωση, κατά τον προσδιορισμό του μεγέθους του μπλοκ προς τις ιδιότητες πλάτους και ύψους, το πάχος των συνόρων θα προστεθεί, καθώς και εσωτερικές και εξωτερικές περιπτώσεις, οπότε το πρώτο μπλοκ θα έχει μεγάλες διαστάσεις.

Ύψος και πλάτος στοιχείου υπολογίζονται υπολογισμένες τιμές. Κάθε στοιχείο της ιστοσελίδας αποτελεί μια ορθογώνια περιοχή, η οποία με τη σειρά του αποτελείται από διάφορες περιοχές - Περιοχή περιεχομένου (Περιεχόμενο), Περιοχές εσοχής, Περιοχή πλαισίου και Περιοχές πεδίου στοιχείο.

Μεταξύ των περιεχομένων του στοιχείου και το πλαίσιο του βρίσκεται Βουτιά Padding, πέρα \u200b\u200bαπό το στοιχείο - πεδίο Περιθώριο. Η περιοχή περιεχομένου υπάρχει σε κάθε στοιχείο, οι υπόλοιπες περιοχές είναι προαιρετικές.

Σύκο. 1. Στοιχείο μοντέλου μπλοκ

1. Στοιχείο ύψους

Το ύψος ιδιοκτησίας θέτει το ύψος του περιεχομένου του στοιχείου μπλοκ και δεν έχει καμία επίδραση στα πεζά στοιχεία της οθόνης: inline. . Το ύψος των πεζών στοιχείων είναι ίσο με το ύψος του περιεχομένου τους. Οι αρνητικές τιμές δεν επιτρέπονται. Το ακίνητο δεν κληρονομείται.

Σύνταξη

P (Ύψος: 100px;)

2. Πλάτος του στοιχείου

Η ιδιότητα πλάτους ορίζει το πλάτος του περιεχομένου του στοιχείου μπλοκ και δεν έχει καμία επίδραση στα πεζά στοιχεία της οθόνης: inline. . Το πλάτος των πεζών στοιχείων ισούται με το πλάτος του περιεχομένου τους. Οι αρνητικές τιμές δεν επιτρέπονται. Το ακίνητο δεν κληρονομείται.

Σύνταξη

P (πλάτος: 100px;)

3. Ύψος και πλάτος του απολύτως τοποθετημένου στοιχείου

Ορίστε το πλάτος και το ύψος μιας απολύτως τοποθετημένης θέσης θέσης θέσης: Απόλυτη. Δεν είναι πάντοτε απαραίτητο, δεδομένου ότι στην περίπτωση αυτή το ύψος και το πλάτος προσδιορίζονται σιωπηρά από την μετατόπιση του στοιχείου. Εάν το στοιχείο ορίζεται από το περίγραμμα των συνόρων και το πεδίο περιθωρίου, μειώνουν το μέγεθος της περιοχής περιεχομένου στις αντίστοιχες τιμές.

Div (φόντο: # 6A7690; θέση: απόλυτη · κορυφή: 0 · κάτω: 0 · αριστερά: 50% · δεξιά: 0;) / * σε αυτή την περίπτωση, το πλάτος είναι 50% του στοιχείου είναι το 50% το γονικό μπλοκ * /
Σύκο. 2. Ύψος και πλάτος του απολύτως τοποθετημένου στοιχείου

4. Ενοικιαζόμενα στοιχεία του στοιχείου

Χρησιμοποιώντας την ιδιότητα Padding, μπορείτε να ορίσετε τις περιπτώσεις ταυτόχρονα για αρκετές πλευρές του στοιχείου με την ακόλουθη σειρά :. Εάν το στοιχείο έχει φόντο, θα ισχύσει για τις περιπτώσεις, συμπεριλαμβανομένων. Οι αρνητικές τιμές δεν επιτρέπονται. Το ακίνητο δεν κληρονομείται.

Εάν έχουν καθοριστεί τρεις τιμές, για παράδειγμα, DIV (padding: 10px 20px 30px,), τότε θα διανεμηθούν με την ακόλουθη σειρά: η πρώτη τιμή είναι η ανώτερη περίπτωση, η δεύτερη είναι η δεξιά και η αριστερή περίπτωση, το τρίτο είναι η κατώτερη περίπτωση.
Εάν προσδιορίζονται δύο τιμές, για παράδειγμα, DIV (padding: 10px 20px,), τότε η πρώτη θα αποσκοπεί στην επάνω και κατώτερη περίπτωση, το δεύτερο είναι σωστό και αριστερά.
Μια τιμή, για παράδειγμα, div (padding: 10px,), θα εγκαταστήσει την ίδια περίπτωση για όλες τις πλευρές του στοιχείου.

Σύνταξη

P (Padding: 5px 10px 15px 10px;)

4.1. Τις περιπτώσεις στη μία πλευρά του στοιχείου

Για να ορίσετε μια αντάρτη μόνο στη μία πλευρά του στοιχείου, πρέπει να χρησιμοποιήσετε μία από τις ιδιότητες του Padding-Top, Padding-Right, Padding-Bottom, Padding-αριστερά, για παράδειγμα:

P (Padding-αριστερά: 10px;)

5. Πεδία στοιχείου

Τα περισσότερα στοιχεία χωρίζονται από κάθε άλλο τομέα. Το περιθώριο περιθωρίου είναι μια σύντομη μορφή εισόδου των πεδίων πεδίου με την ακόλουθη σειρά: κορυφή, δεξιά, κάτω, αριστερά. Χρησιμοποιείται στην περίπτωση που χρειάζεστε για να ορίσετε πεδία από διάφορες πλευρές, αλλά όχι απαραίτητα από τα τέσσερα. Σχετικά κατακόρυφα πεδία στοιχείων μπλοκ καταρρέουν και τα άνω και τα κάτω πεδία δεν έχουν καμία επίδραση στα πεζά στοιχεία. Επιτρέπονται αρνητικές τιμές. Το ακίνητο δεν κληρονομείται.

Εάν έχουν καθοριστεί τρεις τιμές, για παράδειγμα, το DIV (περιθώριο: 10px 20px 30px,), τότε θα διανεμηθούν με την ακόλουθη σειρά: η πρώτη τιμή είναι το κορυφαίο πεδίο, το δεύτερο - το δεξί και το αριστερό πεδίο, το τρίτο πεδίο, το τρίτο - το πεδίο κάτω.
Εάν έχουν καθοριστεί δύο τιμές, για παράδειγμα, DIV (περιθώριο: 10px 20px,), τότε η πρώτη θα αποσκοπεί στο άνω και το κάτω πεδίο, το δεύτερο είναι το δεξί και το αριστερό.
Μια τιμή, για παράδειγμα, Div (περιθώριο: 10px,), θα ορίσει τα ίδια πεδία για όλες τις πλευρές του στοιχείου.

(Περιθώριο: 0 Αυτόματη;) Θα λειτουργήσει μόνο αν το πλάτος του στοιχείου έχει καθοριστεί σαφώς.

Σύκο. 3. Περιθώριο: Αυτόματη; Για ένα απολύτως τοποθετημένο στοιχείο

Σύνταξη

DIV (περιθώριο: 5px 10px 2px 5px;)

5.1. Πεδία στη μία πλευρά του στοιχείου

Το περιθωριακό, το περιθωριοποιημένο, το περιθωριακό, το βυθό, το περιθώριο-αριστερό επίπεδο ελέγχεται από τα αντίστοιχα πεδία σε κάθε πλευρά του στοιχείου, για παράδειγμα:

P (περιθώριο: 10px;)

6. Όριο πλάτους και ύψος

Το CS υποστηρίζει επίσης αρκετές άλλες ιδιότητες που σχετίζονται με το ύψος και το πλάτος των στοιχείων της VEB-Stance: Min-Ύψος, Min-Width, Max-Ύψος και Max-Width. Αυτές οι ιδιότητες σας επιτρέπουν να ορίσετε την ελάχιστη και μέγιστη τιμή του πλάτους ή του ύψους του στοιχείου, δίνοντας στο στοιχείο τη δυνατότητα να γεμίσει τον διαθέσιμο χώρο. Οι ιδιότητες χρησιμοποιούνται συχνά για την προσαρμογή σχεδιασμού ιστοσελίδων. Χρησιμοποιείται για όλα τα στοιχεία, εκτός από τα πεζά και τα τραπέζια. Πάντα να έρχονται μετά τον κύριο κανόνα, δηλ. Μετά τη ρύθμιση του στοιχείου ύψους ή πλάτους. Δεν κληρονομείται.

Μπορείτε να ορίσετε συμβατικές διαστάσεις χρησιμοποιώντας μία μονάδες μέτρησης και περιορισμοί διαστάσεων χρησιμοποιώντας άλλες μονάδες, για παράδειγμα:

DIV (πλάτος: 400px; μέγιστο πλάτος: 50%;)

Το στοιχείο θα έχει πλάτος 400px μόνο εάν αυτή η τιμή δεν υπερβαίνει το 50% του πλάτους του δοχείου, διαφορετικά θα μειωθεί το πλάτος του.

Τα περισσότερα στοιχεία σε HTML συνήθως αντιστοιχούν ένα καθορισμένο ύψος και πλάτος. Ορίστε αυτές τις παραμέτρους στο CSS είναι αρκετά εύκολο, και ως αποτέλεσμα - πρακτικό. Χρησιμοποιείται για αυτό το ύψος και τις ιδιότητες πλάτους που είναι ήδη γνωστές σε εσάς. Ωστόσο, σε αυτό το μάθημα θα μιλήσουμε ακόμα για όχι σταθερό πλάτος και ύψος ή καουτσούκ, δηλαδή, ανάλογα με το πλάτος του ίδιου του παραθύρου. Ας προχωρήσουμε)

πλάτος

Αυτή η ιδιότητα δημιουργεί ένα συγκεκριμένο πλάτος HTML του στοιχείου. Η τιμή μπορεί να υποδειχθεί σε εικονοστοιχεία, ποσοστά (άλλες τιμές χρησιμοποιούνται λιγότερο συχνά).

Το μπλοκ μου (
Πλάτος: 400px; / * πλάτος 400 pixels * /

}
Ή σε ποσοστό:

Myblockpercent50 (
Πλάτος: 50%. / * πλάτος 50% του πλάτους του μπλοκ ή του παραθύρου (αν όχι μέσα στο μπλοκ με ένα σταθερό πλάτος) * /
Χρώμα: # f1f1f1; / * Ανοιχτό γκρι μπλοκ * /
}
Συνεπώς, παίρνουμε ένα μπλοκ που θα είναι πάντα μισό από τον γονέα.

Τώρα για το πιο ενδιαφέρον. Το πλάτος έχει τέτοιες παραμέτρους που υποδεικνύουν το μέγιστο ή το ελάχιστο πλάτος. Αυτά είναι ιδιότητες Min-Width και Max-Width, αντίστοιχα. Μπορείτε επίσης να καθορίσετε τιμές για αυτούς σε εικονοστοιχεία και σε ποσοστό και σε άλλες τιμές. Αυτές οι ιδιότητες αποτελούν τη βάση για τη δημιουργία καουτσούκ και προσαρμοστικών σχεδίων ().

Ένα παράδειγμα προσαρμοστικού σχεδιασμού. Κοιτάξτε, αλλάζοντας τα μεγέθη του παραθύρου του Brazura:

Αυτό, φυσικά, έτρεξε προς τα εμπρός. Αλλά πρέπει να καταλάβετε τι και γιατί χρειάζεστε. Ναι, και αγγίξτε ένα ωραίο αποτέλεσμα)

Καθώς έχετε ήδη κατανοήσει, χρησιμοποιώντας αυτές τις ιδιότητες, μπορείτε να χειριστείτε πιο ευέλικτα τα στοιχεία στη σελίδα, να μην στρεβλώσετε το περιεχόμενο. Πως δουλεύει? Εξετάστε τον κώδικα.

ΟΙΚΟΔΟΜΙΚΟ ΤΕΤΡΑΓΩΝΟ (
Μέγιστο πλάτος: 800px;
Ιστορικό-Χρώμα: # F1F1F1; / * Ανοιχτό γκρι μπλοκ * /
Padding: 20px;
}
Ένα μπλοκ με δεδομένα με γονικό πλάτος 200 pixel θα πάρει μια κατάλληλη τιμή, αλλά εάν το γονικό μπλοκ είναι μεγαλύτερο, για παράδειγμα, 1000 pixels, θα πάρει ήδη το μέγιστο πλάτος του, δηλαδή 800 pixels. Δηλαδή, θα αυξηθεί ενώ το πλάτος του γονικού μπλοκ δεν θα είναι 801 pixels και πολλά άλλα. Στη συνέχεια, το μπλοκ μπλοκ θα έχει πάντα το μέγιστο επιτρεπόμενο πλάτος του 800 pixels.

Υψος

Αυτή η ιδιότητα είναι υπεύθυνη για το ύψος του στοιχείου. Όλα τα ίδια κατάλληλα για CSS χρησιμοποιούνται ως ποσότητα. Πιο συχνά το ίδιο ενδιαφέρον και εικονοστοιχεία.

Πληροφορίες (
Ύψος: 200px; / * Το ύψος μπλοκ θα είναι 200 \u200b\u200bpixels * /
Padding: 10px; / * Επαναλάβετε σχετικά με τις περιπτώσεις μέσα στο μπλοκ \u003d) * /
}
Είναι λογικό, στο ύψος μπορείτε να καθορίσετε τις ελάχιστες και μέγιστες τιμές ύψους για το στοιχείο ιδιοτήτων Min-Ύψος και το μέγιστο ύψος, αντίστοιχα.

Πληροφορίες (
Μέγιστο ύψος: 360px; / * Μέγιστο ύψος μπλοκ * /
Min-Ύψος: 120px; / * Ελάχιστο ύψος μπλοκ * /
}
Όπως μπορείτε να δείτε, οι ιδιότητες μπορούν να είναι και συχνά πρέπει να χρησιμοποιηθούν σε ένα ζευγάρι.
Ή συνδυάζουν τιμές:

Περιεχόμενο (
Ύψος: 100%. / * Το ύψος θα είναι πάντα 100% * /
Πλάτος: 760px; / * Αλλά το πλάτος είναι σταθερό 760 pixels * /
}
Εάν έχετε οποιεσδήποτε ερωτήσεις, γράψτε στα σχόλια!

Ευχαριστώ για την προσοχή! Επιτυχίες στο χειρότερο!)

Προκειμένου το αντικείμενο να ρυθμιστεί ένα ορισμένο πλάτος και ύψος, υπάρχουν δύο ιδιότητες στο πλάτος και το ύψος του CSS (αντίστοιχα). Με τη βοήθειά τους, μπορείτε να ορίσετε τις σταθερές διαστάσεις των στοιχείων, της πλευρικής γραμμής, της εικόνας, του τραπεζιού ή οποιουδήποτε μπλοκ.

Χαρακτηριστικά του υπολογισμού πλάτους και ύψους

Για να προσδιορίσετε το πλάτος ή το ύψος του αντικειμένου, μπορείτε να χρησιμοποιήσετε οποιεσδήποτε μονάδες μέτρησης μήκους στο CSS. Το πιο απλό στην κατανόηση των εικονοστοιχείων. Εάν χρησιμοποιείτε ένα ποσοστό εισόδου, λάβετε υπόψη ότι στην περίπτωση αυτή το πλάτος του αντικειμένου θα εξαρτηθεί από το πλάτος του γονέα του. Εάν δεν υπάρχει κανείς, τότε το πλάτος του στοιχείου υπολογίζεται, με βάση το πλάτος του παραθύρου του προγράμματος περιήγησης (όταν ο χρήστης αλλάξει το πλάτος του παραθύρου, η τιμή πλάτους θα επανυπολογιστεί).

Ως τιμή πλάτους, μπορείτε επίσης να χρησιμοποιήσετε μια μονάδα EM, η οποία είναι περίπου η ίδια με το μέγεθος του κειμένου του κειμένου, αλλά μόνο σε συμβατικές μονάδες. Για παράδειγμα, εγκαταστήσατε το μέγεθος για τη γραμματοσειρά 24px. Στη συνέχεια, το 1em για αυτό το στοιχείο θα είναι ίσο με 24pixel, και αν ορίσετε το πλάτος: 2em, τότε το πλάτος θα είναι 2 × 24px \u003d 48 εικονοστοιχεία. Εάν το μέγεθος της γραμματοσειράς δεν έχει καθοριστεί, θα κληρονομηθεί.

Το ύψος ύψους που ορίζεται σε ποσοστό υπολογίζεται με τον ίδιο τρόπο όπως το πλάτος, αλλά ο υπολογισμός βασίζεται στο ύψος του γονικού στοιχείου και όχι στο πλάτος του. Εάν ο γονέας λείπει, το ύψος θα εξαρτηθεί από το ύψος του παραθύρου του προγράμματος περιήγησης.

Το ποσοστό πλάτος και το ύψος του στοιχείου παιδιού υπολογίζεται με βάση το μέγεθος του γονέα

Τι είναι σε πλάτος και ύψος

Αμέσως αξίζει να θυμόμαστε ότι οι ιδιότητες του πλάτους και το ύψος έχουν ένα χαρακτηριστικό - δεν περιλαμβάνουν περιθώριο, padding και σύνορα. Η τιμή που θέσατε για πλάτος / ύψος θα σημαίνει μόνο το πλάτος / ύψος της περιοχής περιεχομένου του στοιχείου.

Έτσι, για να υπολογιστεί, για παράδειγμα, το πραγματικό πλάτος του στοιχείου (ο τόπος που πραγματικά παίρνει στην οθόνη), θα χρειαστείτε λίγο αριθμητική. Το πραγματικό πλάτος είναι το άθροισμα των τιμών όπως το πλάτος, η επένδυση, τα σύνορα και το περιθώριο. Θυμηθείτε ότι νωρίτερα θεωρήσαμε πώς μοιάζει το μοντέλο CSS Block.

Για να εξασφαλίσετε τη γνώση, δείξτε ένα παράδειγμα. Ας υποθέσουμε ότι έχετε ένα στοιχείο με ένα τέτοιο στυλ:

Πλάτος: 200px; Περιθώριο-αριστερά: 15px; Περιθώριο-δεξί: 15px; Padding-αριστερά: 10px; Επισκέψεις: 3px στερεό # 333;

Για να υπολογίσετε το πραγματικό πλάτος στοιχείου, θα πραγματοποιήσουμε προσθήκη:

Πλάτος + περιθώριο-αριστερό + περιθώριο-δεξιά + padding-αριστερό + όριο-αριστερά \u003d 200px + 15px + 15px + 10px + 3px \u003d 243px (πραγματικό πλάτος)

Η ιδιότητα ύψους μπορεί να είναι βολική εάν χρειαστεί να ελέγξετε με ακρίβεια, για παράδειγμα, ένα ύψος εικόνας. Ωστόσο, εάν ένα δοχείο περιέχει κείμενο ή οποιοδήποτε άλλο περιεχόμενο που μπορεί να μεταβάλει το ύψος, συνιστάται εξαιρετικά να ρυθμίσετε ένα σταθερό ύψος για το δοχείο, καθώς μια τέτοια διάταξη μπορεί να οδηγήσει σε ένα απροσδόκητο αποτέλεσμα - το περιεχόμενο θα εμφανιστεί πάνω από ένα άλλο περιεχόμενο .

Αντί ενός σταθερού ύψους, το ύψος χρήσης: AUTO - Αυτή η εγγραφή σημαίνει ότι το ύψος του αντικειμένου θα υπολογιστεί αυτόματα, ανάλογα με τα περιεχόμενα που περιέχει.

Ένας άλλος τρόπος για να αποφύγετε να σπάσετε τη διάταξη είναι η χρήση υπερχείλισης: αυτόματη εγγραφή. Σε αυτή την περίπτωση, εάν το ύψος περιεχομένου υπερβεί την τιμή ύψους του δοχείου του, το πρόγραμμα περιήγησης θα προσθέσει μια ράβδο κύλισης στο δοχείο.

Στο επόμενο μάθημα, θα μάθετε πώς να υπερισχύσετε το πλάτος του στοιχείου χρησιμοποιώντας μια ενδιαφέρουσα και πολύ χρήσιμη ιδιοκτησία.