ich hab das Problem, dass sich meine Elemente immer verschieben
Immer?!
Bei mir verschieben sich, genauer gesagt brechen die mittlere und rechte Spalte ("Categories" & "Quick Links"), sowie die "Social-Icons" erst dann eine Zeile nach unten um, sobald die Viewport-Breite nicht mehr ausreicht, sie neben der ersten (linken) Spalte "About" bzw. neben dem "Copyright"-Text darzustellen, was absolut in der Natur der Sache liegt, sprich dieses Verhalten völlig normal ist, und daher in meinen Augen bzw. nach meinem Fachverständnis für ein gesundes/normales (Browser-)Verhalten überhaupt keinen Fehler darstellt.
Letztendlich entspricht das auch, der von Dir verlinkten Originalvorlage von
[email protected], für ein konfiguriertes
Bootstrap-FooterTemplate à la
https://getbootstrap.com/docs/5.3/examples/footers/
Siehe hierzu auch die Quelle des darin eingebundenen CSS in minimierter Fassung:
[ spoiler ] Es kommt dann, zumindest bei mir, die kritische (Rück)Frage auf, wie Du in diesem Fall überhaupt von "Deinen Elementen" sprechen kannst?! [ /spoiler ]
Ich bin gleichzeitig auch dabei es responsive zu machen was ein weiteres Problem ist.
Mit Blick auf "Responsive Design" ist da alles in Ordnung, weil auf allen kleineren, respektive schmäleren, Bildschirmen (Tablets, Smartphones) dieses Verhalten genau so erwünscht/gedacht ist.
Ansonsten, von welchem vermeintlich weiteren Problem sprichst Du konkret?!
SELFHTML-WIKI schrieb:
Luke Wroblewski hatte in seinem Buch „Mobile First!“
[3] die Idee, den Prozess umzudrehen und mit einer abgespeckten, mobilen Version zu beginnen. Dies sollte aber kein Selbstzweck sein, sondern den Fokus wieder auf die ältere, aber immer noch gültige Maxime „Inhalt über Design“ und andere
Usability-Grundsätze legen.
Mobile First baut auf folgenden Tatsachen auf:
- Inhalte im Layout für kleine Bildschirme werden meist untereinander dargestellt.
- Dies ist auch das Verhalten eines jeden Browsers bei einem HTML-Dokument ohne jegliches CSS.
- Die Inhalte für einen großen Viewport werden oft nebeneinander angeordnet.
Zitatquelle: https://wiki.selfhtml.org/wiki/Responsiv(es_Webdesign)
Anscheinend hast Du diesbezüglich eine andere/falsche Vorstellung, welche Strategie diese Technik verfolgt.
Wenn das CSS-Framework Bootstrap korrekt angewendet, und mit Sinn und Verstand ein individuell/zusätzlich erforderliches CSS ergänzt wird, ist "Responsive Design" ein absoluter Selbstläufer, ohne sich in der Entwicklung/Produktion einer Webseite diesbezüglich mit irgendwelchen Fragestellungen/Problemen auseinandersetzen zu müssen, oder es zu einer sog. "Raketenwissenschaft" zu erheben.
Das ist nunmal, u.a. auf diesen Aspekt bezogen, die Ideologie und der praktische Vorteil solch eines Rahmenwerks, dass der Entwickler mit einer arbeitserleichternden (= ökonomischen) Grund-/Programmierstruktur unterstützt wird, ohne in diversen, zum Teil auch komplexen, Anwendungsfällen das Rad neu erfinden zu müssen.
Ich würde mich freuen, wenn ihr mir hilft und sagt, was das Problem am Code ist und wie man diese anschließend beheben kann.
Am Ende meiner ausführlichen/dezidierten Erläuterungen kann ich vorerst nicht nachvollziehen, was Du Dir, entgegen der im Netz entdeckten fehlerfreien/lauffähigen Vorlage, anders erwünschst/vorstellst, um hier eine konstruktive u. zielführende Lösung vorschlagen zu können.
Falls ich mich hier -unerwarteter Weise- "völlig betriebsblind" zu Wort gemeldet, ergo Dein Anliegen mißverstanden, und in Deinem verlinkten Demo etwas übersehen haben sollte, bitte ich (und im Sinne aller interessiert mitlesenden Community-Mitglieder!) um eine punktgenaue Fehlerbeschreibung bzgl. der Verschiebungen, und vor allem entgegen Deines oben genannten (aus dritter Quelle stammenden u. fehlerfreien!) Demos, um einen Link zu Deiner eigenen tatsächlich problembehafteten Seite bzw. deren [email protected], die Dein thematisiertes Problem tatsächlich beinhaltet.
