seufZ: Mehrere divs im einem gesamt-div und ein daraus resultierendes floating Problem

Hallo @ all,

ich habe folgendes Problem:

layout

Ich möchte das rot eingekästelte div (worin sich die orange gekästelten (unter)-divs befinden neben dem blau eingekästelten div anordnen

Ich weiss, das die breite des rot-eingekästelten div zusammen mit dem blau eingekästelten div BREITER als der viewport ist. Das soll auch so sein, ich möchte ein horizontal scrollbare Webseite.

Leider muss ich die orange eingekästelten (unter)-divs in einem zusammenhängenden (hier rot) zusammenfassen, da ich später mit anker zu dem entsprechenden (unter)-div springen möchte! Dabei wird der Inhalt der gelb umrandeten divs später noch breiter, hier zur Anschauung hab ich die mal nicht so breit gemacht!

Linkbeschreibung

Ich habe alles ausprobiert: display-inline-block hier, position: ablosute; dort, in allen erdenklichen variationen!

Wer kann mir dabei bitte Helfen?

Ich bin am verzweifeln!

Grüsse der einsiedelnde

  1. @@seufZ

    Das soll auch so sein, ich möchte ein horizontal scrollbare Webseite.

    Auf dem von dir gezeigten Bild sehe ich aber eine vertikal und horizontal scrollbare Webseite. Das kannst du nicht wollen.

    Vielleicht bekommt man eine horizontal scrollbare Webseite noch halbwegs bedienbar hin, wenn man sicherstellt, dass die Inhalte nicht höher sind als der Viewport – und zwar auf keinem Gerät. Dann kan man auch Nutzerinteraktionen von vertikalem Scrollen auf horizontales Umlegen, sodass man bspw. mit dem Mausrad scrollen kann.

    Dazu braucht man tiefere CSS-Kentnisse und vermurtlich auch ein paar JavaSript-Kentnisse. Wenn das nicht vorhanden ist, kann man von diesem Vorhaben nur abraten.

    LLAP 🖖

    --
    Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
    1. @@Gunnar Bittersmann

      Vielleicht bekommt man eine horizontal scrollbare Webseite noch halbwegs bedienbar hin, wenn man sicherstellt, dass die Inhalte nicht höher sind als der Viewport – und zwar auf keinem Gerät.

      Bekommt man.

      Dann kan man auch Nutzerinteraktionen von vertikalem Scrollen auf horizontales Umlegen, sodass man bspw. mit dem Mausrad scrollen kann.

      Das allerdings kann man dort nicht.

      LLAP 🖖

      --
      Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
  2. Soweit habe ich es...

    siehe: Linkbeschreibung

    Nun sind momentan alle Angaben in px das möchte ich dahingehend ändern das alle Angaben in % sind! Falls dies bei diesem Projekt überhaupt möglich ist!!!!

    Da ergeben sich mir ein Paar Fragen:

    Es ist nicht so einfach, width für das "blaue div" sowie die einzelnen "gelben divs" im einfassenden "roten div" in % umzusetzen........ Ich meine damit: Entweder A: ich behalte die Angabe für den "wrapper" in px (hier 10800 irgendwas px.....) (Also alle divs nebeneinander sind irsinnig breit....) Und die div`s ( blau, rot sowie die unterdivs in gelb) geb ich dann in % an...... Dann bedeutet das, das sich beispielsweise beim "blauen div" die (angenommenen) 15% auf die 10800 irgendwas px beziehen..... sehe ich das so richtig? Und so muss ich dann bei allen Angaben weitermachen: Das "rote div" a 5 stck. * 15% / das einzelne "gelbe div" 15%....... Trotzalledem funktioniert das nicht, warum sehe ich da etwas falsch?

    Achso B) oder ich mach die Angabe des "wrapper" auch in %, klaro müsste dann der Wert mehr als 100% sein........ Auch wenn ich das mache, funktioniert es nicht, warum?

    Igendwas bezieht sich immer auf irgendwas, aber es ist nicht klar ersichtlich worauf?

    Ich habe da keinen Überblick mehr!

    Wer kann mir da weiterhelfen und einen klaren Blick verschaffen!

    seufZende grüsse

    1. @@seufZ

      Igendwas bezieht sich immer auf irgendwas, aber es ist nicht klar ersichtlich worauf?

      Die Einheit vw bezieht sich auf die Viewportbreite.

      Wer kann mir da weiterhelfen und einen klaren Blick verschaffen!

      Das hab ich schon versucht. Sogar in diesem Thread.

      LLAP 🖖

      --
      Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
      1. es ist mir nicht klar wie mir das weiterhelfen soll.... für jemanden erklärt der dem englischen nicht soooo mächtig ist..........

        :o(

        1. @@seufZ

          es ist mir nicht klar wie mir das weiterhelfen soll.... für jemanden erklärt der dem englischen nicht soooo mächtig ist..........

          Du weißt aber schon, dass SELFHTML eine Doku hat? (Ist auch auf jeder Forumsseite verlinkt.)

          Da gibt’s ein Suchfeld, da könnte man bspw. auf die Idee kommen, vw einzugeben.

          LLAP 🖖

          --
          Ist diese Antwort anstößig? Dann könnte sie nützlich sein.