Ergebnis 1 bis 6 von 6
Like Tree1Likes
  • 1 Post By mikdoe

Thema: Anordnung von Boxen und Umstellmöglichkeit für Mobile Ansicht

  1. #1
    Bexsta ist offline Doppel-As
    registriert
    08-11-2009
    Beiträge
    120

    Anordnung von Boxen mit Umstellmöglichkeit für Mobile Ansicht

    Hallo lieber CSS Freaks,

    seit einige Zeit beschäftigt mich ein Layout, dass es mir leider nicht Möglich macht die Content Boxen ordentlich auszurichten und für die Mobile Ansicht die Reihenfolge änderbar ist.

    Habe es bereits mit Flex und Grid sowie mit der OldSchool Variante Float probiert.

    Dazu eine kleine Grafik:

    layout_k_jsforum.jpg

    1 die Höhe ist nicht bekannt weil vom Content abhängig
    2 die Höhe ist auch nicht bekannt
    3 height und width sind bekannt

    in der Mobilen Ansicht rutscht Item 2 auf Platz 1 und 1 und 3 sind 2 und 3, wie ja zusehen.

    Mit Grid war es mir überhaupt nicht möglich dies Umzusetzen da das Grid-System immer von Zeilen Anfang Anfängt und Box 2 eine Variable Höhe hat.
    Bei Flex in der Screen Ansicht bleibt Container 3 immer unter 1 und Rutscht nicht hinter zwei nach. Dadruch das 1 keine festhöhe hat ist mir nicht möglich einen umbruch zu erzeugen das 2 und 3 rechts neben 1 wandern.
    Float funktioniert jedoch scheint mir dies nicht die opimale Variante zu sein. Es gibt noch weitere Anordnungen in dem es mit Float auch nicht funktioniert.

    Wenn die Grafik nicht selbsterklärend ist, kurz Bescheid geben, kann gerne eine neue hochladen.

    - - - Aktualisiert - - -

    Ist die Problematik blöd erläutert oder warum Antwortet niemand?
    Geändert von Bexsta (10-02-2020 um 16:09 Uhr) Grund: Rechtschreibung :)

  2. #2
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.738

    AW: Anordnung von Boxen mit Umstellmöglichkeit für Mobile Ansicht

    Zitat Zitat von Bexsta Beitrag anzeigen
    Ist die Problematik blöd erläutert oder warum Antwortet niemand?
    Hier ist leider nicht mehr so viel los wie früher. stack sei Dank...
    Das deutsche Javascript Forum http://forum.jswelt.de http://forum.jswelt.de/images/logoJsWeltForumV4_32x22.png
    Sorry wenn ich manchmal ohne Hallo und nur klein schreibe! Dann bin ich nicht unfreundlich sondern mit nervigem kleinem Touch Tablet zugange

  3. #3
    Bexsta ist offline Doppel-As
    registriert
    08-11-2009
    Beiträge
    120

    AW: Anordnung von Boxen und Umstellmöglichkeit für Mobile Ansicht

    Naja aber werden schon über 60 Hits angezeigt..glaube, es will sich keiner die Mühe machen, das mal Nachzustellen!

  4. #4
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.738

    AW: Anordnung von Boxen und Umstellmöglichkeit für Mobile Ansicht

    Zitat Zitat von Bexsta Beitrag anzeigen
    glaube, es will sich keiner die Mühe machen, das mal Nachzustellen!
    Vielleicht eine Zeitfrage. Mit einem JSFiddle wäre es sicher einfacher.
    Bexsta likes this.
    Das deutsche Javascript Forum http://forum.jswelt.de http://forum.jswelt.de/images/logoJsWeltForumV4_32x22.png
    Sorry wenn ich manchmal ohne Hallo und nur klein schreibe! Dann bin ich nicht unfreundlich sondern mit nervigem kleinem Touch Tablet zugange

  5. #5
    Bexsta ist offline Doppel-As
    registriert
    08-11-2009
    Beiträge
    120

    Question AW: Anordnung von Boxen und Umstellmöglichkeit für Mobile Ansicht

    Du hast natürlich Recht. So macht es die Sache einfacher!

    Habe nun das erweiterte Layout genommen da dort die Problematik am umfangreichsten ist.
    Erstmal geht es um die Anordnung der Boxen für die Screen-Ansicht. Was vielleicht erwähnt werden sollte ist, das die Boxen in der Mobilen Ansicht die Reihenfolge ändern.

    Container 3 passt die Höhe an den links angrenzenden Container 1 an, hat eigentlich eine unbekannte Höhe, da dieser vom Content bestimmt werden soll.
    Container 4 sollte direkt unter Con 3 erscheinen.

    Zur Veranschaulichung nochmal eine Grafik.

    Unbenannt-1.jpg

    jsfiddle

    Werde das Gefühl nicht los, dass so die Konstellation nicht mit Grid umsetzbar ist, da Grid ausschließlich mit bekannten Größen arbeitet.
    Jedoch ist es mit Flexbox auch nicht, soweit mir jetzt bekannt, umsetzbar, da wenn man die direction auf column umstellt, flex nicht weiß ab wann die items umgebrochen werden sollen bzw es keine festegröße für einen Umbruch gibt.
    Geändert von Bexsta (17-02-2020 um 13:24 Uhr)

  6. #6
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.715

    AW: Anordnung von Boxen und Umstellmöglichkeit für Mobile Ansicht

    Soll 3 jetzt so hoch sein wie 1 oder nicht? In der Graphik sind sie nicht gleich hoch.

    Soweit ich das sehe, musst du für die Mobile-Sicht nur die Reihenfolge ändern. Das kannst du mit Flexbox machen: https://developer.mozilla.org/en-US/...ing_Flex_Items

    Die Desktop-Version ist dann die komplizierte, aber ich denke, dass du das mit Grid bauen kannst: https://jsfiddle.net/vyqmLzpo/1/

Ähnliche Themen

  1. Antworten: 1
    Letzter Beitrag: 26-10-2012, 00:38
  2. anordnung von elementen
    Von berni.walzl im Forum JavaScript
    Antworten: 9
    Letzter Beitrag: 08-09-2008, 19:00
  3. Rechte Anordnung eines element
    Von Antiproporsatio im Forum CSS und (X)HTML
    Antworten: 5
    Letzter Beitrag: 05-11-2006, 21:18
  4. Anordnung in Datenbank ändern
    Von 852224 im Forum Serverseitige Programmierung
    Antworten: 5
    Letzter Beitrag: 07-11-2005, 06:16
  5. asp - Kategorien Anordnung
    Von Nonens im Forum Serverseitige Programmierung
    Antworten: 14
    Letzter Beitrag: 20-12-2001, 13:01

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •