Απενεργοποιήστε την απόκριση του Bootstrap καθορίζοντας το πλάτος του κοντέινερ και χρησιμοποιώντας την πρώτη βαθμίδα συστήματος πλέγματος. Διαβάστε την τεκμηρίωση για περισσότερες πληροφορίες.
Σημειώστε την έλλειψη του <meta name="viewport" content="width=device-width, initial-scale=1">, το οποίο απενεργοποιεί την πτυχή μεγέθυνσης των τοποθεσιών σε κινητές συσκευές. Επιπλέον, επαναφέραμε το πλάτος του κοντέινερ μας και αλλάξαμε τη γραμμή πλοήγησης για να αποτρέψουμε την κατάρρευση και βασικά είμαστε έτοιμοι.
Ως προειδοποίηση, το στοιχείο της γραμμής πλοήγησης είναι μάλλον δύσκολο εδώ, καθώς τα στυλ για την εμφάνισή του είναι μάλλον συγκεκριμένα και λεπτομερή. Παρακάμπτονται για να διασφαλιστεί ότι η εμφάνιση των στυλ επιφάνειας εργασίας δεν είναι τόσο αποτελεσματική ή κομψή όσο θα ήθελε κανείς. Απλώς να έχετε υπόψη σας ότι μπορεί να υπάρχουν πιθανές γκοτσάδες καθώς χτίζετε πάνω από αυτό το παράδειγμα όταν χρησιμοποιείτε τη γραμμή πλοήγησης.
Οι διατάξεις που δεν αποκρίνονται τονίζουν ένα βασικό μειονέκτημα στα σταθερά στοιχεία. Οποιοδήποτε σταθερό στοιχείο, όπως μια σταθερή γραμμή πλοήγησης, δεν θα έχει δυνατότητα κύλισης όταν η θύρα προβολής γίνει στενότερη από το περιεχόμενο της σελίδας. Με άλλα λόγια, δεδομένου του μη ανταποκρινόμενου πλάτους κοντέινερ των 970 εικονοστοιχείων και της θύρας προβολής 800 εικονοστοιχείων, ενδέχεται να αποκρύψετε 170 εικονοστοιχεία περιεχομένου.
Δεν υπάρχει τρόπος να αποφύγετε αυτό, καθώς είναι η προεπιλεγμένη συμπεριφορά του προγράμματος περιήγησης. Η μόνη λύση είναι μια διάταξη με απόκριση ή χρήση μη σταθερού στοιχείου.