HTML Bootstrap - Headlines Responsive ausgeben

[Blackbenji]

Hallo zusammen,

ich versuche gerade ein "Dashboard" zu erstellen.

Habe das mal auf bootply hingebastelt.
http://www.bootply.com/GXUhmVu8dp

Wenn man sich das nun im Viewer anguckt und auf Smartphonegröße herunter bricht, sieht man was mein Problem ist.

Das erste Div haut ab und die Überschriften passen nicht mehr.

Hat jemand einen Tipp für mich wie ich das besser lösen könnte?

 

[Madman1209]

Hi,

doofe Frage: warum nicht gleich ein fertiges Dashboard nehmen?

VG,
Mad

 

[Cool Master]

Mein erster Tipp aufhören Bootstrap zu nutzen und ein eigenes HTML mit Klassen erstellen. Das Anpassen an die eigene Bedürfnisse dauert idR länger als einfach etwas erstellen.

Ansonsten würde ich sagten stimmt etwas mit deinem HTML oder CSS nicht und du floatest etwas nicht oder es wird nicht korrekt gecleart.

 

[savuti]

Das HTML Gerüst ist völlig falsch aufgebaut. Ich würde das auch mit gefloaten Listen machen. Wozu Bootstrap?

 

[conglom-o]

Wo ist nun genau das Problem? Sind doch alle Divs da und tun das, was bei Bootstrap hinterlegt ist. Oder übersehe ich da was?

 

[ayngush]

Nö, übersiehst nichts. Das sieht mir eher nach dem Versuch aus responsive Datentabellen mit dem Grid nachzubauen, was nicht funktionieren wird, dafür muss man responsive Datentabellen selber bauen. Auch bei Bootstrap.

https://blog.kulturbanause.de/2012/06/tabellen-im-responsive-webdesign/

Der Abschnitt "Tabellen mit CSS umstrukturieren" dürfte interessant sein.

PS: Wenn es geht würde ich auf Tabellen wo es nur geht generell verzichten. Es gibt ja auch noch andere Darstellungsformen als X+Y Achsen + Werte. Zum Beispiel die hier schon erwähnten, gefloateten Listen. Mit "Flexbox" kann man das auch in "schön und formatiert" machen, falls man "on the edge" designen darf.