Tobi: divs oder tabellen floaten lassen

Hi zusammen,

Wenn man viele Bilder (per Javascript) einbindet zeigt der Browser diese nacheinander an, und macht automatisch notwendige "Zeilen"Umbrüche abhängig davon wie gross das aktuelle Fenster ist.

http://www.adventure-travel-experience.de/index.php?report=transafrika_galerie

Nun mochte ich diese Bilder gerne mit einer Bildunterschrift versehen und habe die Bilder dafür in kleine Divs oder Tabellen gepackt. Leider werden die Bilder anschließend nur noch untereinander dargestellt und nicht mehr fließend nebeneinander.

Hat jemand ne Idee wie man hin bekommt dass viele kleine Divs ähnlich wie Bilder fließend hintereinander angezeigt werden? Ich möchte mich ungern auf eine Fensterbreite mit festen Zeilenumbruch festlegen...

Danke fürs Reinschaun, Tobi

  1. Hi!

    Wie es in deiner Überschrift steht: floaten lassen.

    Gib den Containern (Divs) per CSS die Eigenschaft float.

    --
    "Die Diebesgilde beklagte sich darueber, dass Mumm in aller Oeffentlichkeit behauptet hatte, hinter den meisten Diebstaehlen steckten Diebe."
          - T. Pratchett
    1. Hi,

      Gib den Containern (Divs) per CSS die Eigenschaft float.

      <div style='float:left; hat den Nachteil dass der Bilderblock am linken Rand klebt und ich ihn nicht zentrieren kann da ich nicht weiss wie breit er ist...

      float:center funktioniert nicht :(

      Any hints?

      1. Hallo Tobi

        float:center funktioniert nicht :(

        Dann dürfte Gunnars „inline-block – eine Alternative zu float” interessant für dich sein.

        Auf Wiederlesen
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Hi Detlef

          Schade dass du es wirklich nötig hast meinen Thred auf den gerade so viele hilfsbereite Menschen antworten zu schliessen. Willst du damit verhindern dass ich dir wiederspreche?

          LG, Tobi

          1. Hi,

            Schade dass du es wirklich nötig hast meinen Thred auf den gerade so viele hilfsbereite Menschen antworten zu schliessen. Willst du damit verhindern dass ich dir wiederspreche?

            Nein, vermutlich eher andeuten dass du akzeptieren sollst, warum Doppelpostings hier, mit Begründung, unerwünscht sind.

            MfG ChrisB

            --
            Light travels faster than sound - that's why most people appear bright until you hear them speak.
            1. Hi,

              Ich habe keinesfalls ein Doppelposting erstellt sondern ein Frage zu einem neuen Problem gestellt dass später aufgetaucht ist nachdem die Frage wie man Divs fliessen laesst beantwortet war.

              Es ist wirklich schade dass es hier Menschen gibt die nicht helfen sondern ihre Macht missbrauchen um Anderen zu schaden.

              Währe mein zweiter Thred nicht vorzeitig und unberechtigt geschlossen worden hätte mit Sicherheit jemand einen Tip gewusst wie man auch beim IE fliessende Elemente zentrieren kann. Aber das gehört ja nicht in diesen Thred.

              LG, Tobi

          2. Hallöle!

            Schade dass du es wirklich nötig hast meinen Thred auf den gerade so viele hilfsbereite Menschen antworten zu schliessen. [...]

            Wie kommst du denn auf dieses schmale Brett? Hast du dir die Forums-Hilfe überhaupt angesehen?

            Zu deiner Information: In dem Moment, in dem jemand feststellt, dass ein Doppelposting vorhanden ist, tendiert die Bereitschaft, Antworten in dem später gestarteten (also doppelten) Thread zu posten, gegen Null, von daher ist der Thread sowieso verbrannte Erde.

            [...] Willst du damit verhindern dass ich dir wiederspreche?

            Er kann das gar nicht. Lies die Hilfe.

            Wir sperren Doppelpostings grundsätzlich in dem Moment, in dem wir ihrer gewahr werden - egal, ob bereits Antworten vorhanden sind oder nicht. Das liegt schlicht daran, dass es in diesem Forum üblich ist, die jeweils benötigten Informationen zusammenzuhalten.

            Auch dein in dem doppelten Thread geäußertes Argument, dass neue Fragen immer an den Anfang gehörten, zieht hier nicht. Es gibt hier die Möglichkeit, sich die Threads so sortieren zu lassen, wie man das gern haben möchte; näheres dazu findest du in der Forums-Hilfe.

            Es ist immer das Vernünftigste, Folgefragen, die sich im Lauf der Diskussion ergeben, in ein und demselben Thread zu diskutieren, damit jeder, der sich an der Diskussion beteiligen möchte, schnell auf den notwendigen Informationsstand kommen kann und sich nicht einen Wolf quer durchs Forum suchen muß, um sich zusammenzuklauben, wie der Fragesteller an den Punkt gekommen ist, an dem er jetzt ist. So geht halt effizientes Arbeiten, daran kann man sich auch gern gewöhnen, wenn man etwas "nur" als Hobby betreibt.

            Ich hoffe sehr, dass du jetzt verstehst, warum dein Doppelposting gesperrt wurde und dass du nach der Lektüre der Hilfe dann auch weißt, warum Detlef dein Posting nicht gesperrt hat.

            File Griese,

            Stonie

            --
            Mann, muß das schön sein, wenn man immer das letzte Wort hat!
            Und im Übrigen kennt auch Stonie Wayne.
            1. hi,

              (also doppelten) Thread zu posten, gegen Null, von daher ist der Thread sowieso verbrannte Erde.

              ...was man an den hilfreichen Antworten auf den geschlossenen Thred sieht falls es wirklich ein Doppelposting war. Auf den ersten Thred hat nimand mehr geantwortet weil das Problem ja bereits gelöst war.

              Wir sperren Doppelpostings grundsätzlich in dem Moment, in dem wir ihrer gewahr werden - egal, ob bereits Antworten vorhanden sind oder nicht.

              Meiner Meinung nach handelte es sich dabei NICHT um ein Doppelposting und würde mich freun wenn ihr es wieder frei gebt.

              sich die Threads so sortieren zu lassen, wie man das gern haben möchte; näheres dazu findest du in der Forums-Hilfe.

              Das war mir neu. Danke.

              Ich hoffe sehr, dass du jetzt verstehst, warum dein Doppelposting gesperrt wurde

              Nicht wirklich aber im Leben ist eben nicht immer alles verständlich.

              LG, Tobi

              1. Hi,

                (also doppelten) Thread zu posten, gegen Null, von daher ist der Thread sowieso verbrannte Erde.

                ...was man an den hilfreichen Antworten auf den geschlossenen Thred sieht falls es wirklich ein Doppelposting war.

                Die kamen wohl von Leuten, die dein anderes Posting (noch) nicht gelesen hatten.

                Auf den ersten Thred hat nimand mehr geantwortet weil das Problem ja bereits gelöst war.

                Du kannst gar nicht wissen, wer da vielleicht wann noch geantwortet hätte.

                Und die Information, dass du auch innerhalb eines Threads den Beitragtitel ändern kannst, liegt dir ja auch vor - also hättest du auch darin kurz darauf hinweisen können, dass sich ein Folgeproblem ergeben hat.

                Meiner Meinung nach handelte es sich dabei NICHT um ein Doppelposting

                Nach hier vorherrschender und auch begründeter Ansicht aber schon.
                Stonie hat dir auch gerade noch mal die Gründe genannt, warum es für *effektive* Hilfe i.a.R. förderlich ist, wenn du die Informationen zu einem Problem (und damit meine ich hier jetzt die Aufgabenstellung an sich, nicht das Detailproblem, was sich beim Versuch einer Umsetzung auf eine bestimmte Art und Weise ergeben hat) gebündelt an einer Stelle präsentierst, so das interessierte Mitleser (egal, zu welchem Zeitpunkt sie zur Dikussion dazustossen) gleich alle notwendigen und für ihr Verständnis der Aufgabenstellung wichtigen Informationen auch gleich dort vorfinden, und sie nicht erst über mehrere Threads zusammensuchen müssen.

                MfG ChrisB

                --
                Light travels faster than sound - that's why most people appear bright until you hear them speak.
              2. Hallo Tobi

                ...was man an den hilfreichen Antworten auf den geschlossenen Thred sieht falls es wirklich ein Doppelposting war.

                Du meinst die beiden Hinweis auf display:inline-block, die dir verschweigen, dass es in IEs < 8 und Firefox < 3 so nicht funktioniert?

                Auf den ersten Thred hat nimand mehr geantwortet weil das Problem ja bereits gelöst war.

                Praktisch zeitgleich mit diesen Antworten kam meine in diesem Thread, die ich mir verkniffen hätte, wäre mir vorher dein Doppelposting aufgefallen.

                Wie kommst du darauf, dass das Problem bereits gelöst war?
                Du hast doch geschrieben, dass es das nicht ist.

                Hast du den von mir verlinkten Artikel gelesen?

                Was verstehst da bei diesem nicht?
                Warum enthält er keine Lösung für dein Problem?

                Meiner Meinung nach handelte es sich dabei NICHT um ein Doppelposting und würde mich freun wenn ihr es wieder frei gebt.

                Es geht um die selbe Seite, es geht darum, die Bilder auch mit Text nebeneinander anzuzeigen, und der erste Tipp passte nicht wirklich, weil du die Bilder zentriert haben möchtest (was du in deinem Ausgansposting nicht erwähntest).
                Wenn das kein Doppelposting sein soll, was dann?

                Gegen 19:00, als ich diesen Thread sah, nahm ich an, dein Problem wäre durch Steels Antwort gelöst. Dass du es gern zentriert hättest und dir float deshalb nicht hilft, teiltest du uns nach über 9 Stunden mit.
                Und dann fängst du bereits nach einer knappen Stunde einen neuen Thread an, weil du meinst, dass keine weiteren Antworten mehr kommen?

                Schau dich mal ein wenig in diesem Forum um, es gibt Threads in denen nach mehr als 10 Tagen noch geantwortet wird.

                Auf Wiederlesen
                Detlef

                --
                - Wissen ist gut
                - Können ist besser
                - aber das Beste und Interessanteste ist der Weg dahin!
                1. Hallo,

                  Hast du den von mir verlinkten Artikel gelesen?

                  Ja aber mit besagtem Hack für den IE komm ich leider nicht weiter.
                  Mit display: inline; fliessen die Bilder zwar auch im IE, aber dann ist die Bildunterschrift neben den Bildern.  Wenn ich mit <br> erzwinge dass sie unter den Bildern bleibt fliesst nix mehr.

                  teiltest du uns nach über 9 Stunden mit.

                  Richtig. Nachdem ich von der Arbeit kam dachte ich mein erster Thred sei bereits altes Eisen.

                  Schau dich mal ein wenig in diesem Forum um, es gibt Threads in denen nach mehr als 10 Tagen noch geantwortet wird.

                  Damit habe ich nicht gerechnet. Ich war jedoch erstaunt wie schnell auf neue Threds geantwortet wird :)

                  Auf Wiederlesen

                  Würde mich freun :)

                  1. Hast du den von mir verlinkten Artikel gelesen?
                    Ja aber mit besagtem Hack für den IE komm ich leider nicht weiter.
                    Mit display: inline; fliessen die Bilder zwar auch im IE, aber dann ist die Bildunterschrift neben den Bildern.  Wenn ich mit <br> erzwinge dass sie unter den Bildern bleibt fliesst nix mehr.

                    Ein Blick in deine Seite sagt mir, dass du ganz eine andere Baustelle hast.

                    Stichworte:
                    Vermeide unnötige Tabellen.
                    Vermeide inline-CSS
                    ersetze alle deprecated HTML Attribute und Elemente wie font, align etc...
                    Über dich in semantisch sinnvollem Code.
                    Wisse wann du es mit einer Liste zu un hast.

                    PS: Ich bedaure meine Antwort im gelöschten Thread.

                    mfg Beat

                    --
                    ><o(((°>           ><o(((°>
                       <°)))o><                     ><o(((°>o
                    Der Valigator leibt diese Fische
                  2. Hallo Tobi

                    Ja aber mit besagtem Hack für den IE komm ich leider nicht weiter.
                    Mit display: inline; fliessen die Bilder zwar auch im IE, aber dann ist die Bildunterschrift neben den Bildern.  Wenn ich mit <br> erzwinge dass sie unter den Bildern bleibt fliesst nix mehr.

                    Bei meinem Test dazu funktioniert alles wie gewünscht.
                    Erstelle doch mal ein kleines Testbeispiel aus deiner Seite (ohne Javascript) mit direkt eingebundenen Bildern, und verlinke dies hier, damit wir besser nachvollziehen können, warum es bei dir nicht wie gewünscht funktioniert.

                    Damit habe ich nicht gerechnet. Ich war jedoch erstaunt wie schnell auf neue Threds geantwortet wird :)

                    Die ersten Antworten kommen meist sehr schnell und stichwortartig, ohne viel Zeit zu investieren. Sehr oft helfen diese Stichworte bereits, das Problem ist mit minimalem Aufwand gelöst, und der Thread verschwindet nach wenigen Tagen im Archiv.
                    Treten aber weitere Probleme auf, oder passten diese Stichworte nicht, dann wird weiter gefragt und geantwortet. Der Thread bleibt so lange im Forum, wie regelmäßig neue Fragen oder Antworten kommen. Wenn es nötig ist, ist meist auch jemand bereit, viel Zeit zu investieren um gemeinsam mit dem Fragesteller eine Lösung zu finden. Dabei ist es wichtig, dass alles in einem Thread bleibt, damit sich ein potentieller Helfer, schnell und ohne großen Aufwand einen möglichst umfassenden Überblick verschaffen kann, um dann zielgerichtet zu antworten, statt eventuell erst wieder bereits verworfene Lösungsmöglichkeiten vorzuschlagen.

                    Auf Wiederlesen
                    Detlef

                    --
                    - Wissen ist gut
                    - Können ist besser
                    - aber das Beste und Interessanteste ist der Weg dahin!
                    1. Hi,

                      Bei meinem Test dazu funktioniert alles wie gewünscht.

                      Ja da ich ne Browserweiche eingebaut habe und den IE mit float an stelle von display:inline-block füttert damit überhaupt was floatet. Leider kleben mit Float jedoch alle Bilder an der linken Seite. Das war das Problem weshalb ich den neuen Thred eröffnet hatte.

                      Hier ein Beispiel wie beim IE mit 'display: inline; alles schön floatet solange ich mit <br> nicht erzwinge dass der Text unter den Bildern steht. Mit br ist alles wieder untereinander...

                      LG, Tobi

                      1. http://www.adventure-travel-experience.de/index.php?report=transafrika_galerie2

                        1. Hallo Tobi,

                          ist das so schwer zu verstehen?

                          Erstelle doch mal ein kleines Testbeispiel aus deiner Seite (ohne Javascript) mit direkt eingebundenen Bildern, und verlinke dies hier, damit wir besser nachvollziehen können, warum es bei dir nicht wie gewünscht funktioniert.

                          http://www.adventure-travel-experience.de/index.php?report=transafrika_galerie2

                          Stattdessen verlinkst du die Seite, wo du mittels document.write 99 Bilderdivs reinschreibst, noch dazu mit Inlinestyles.
                          Auch das gehört ins zentrale CSS, zum testen auch notfalls ins style-Element im <head>.

                          Also ich blicke auch nicht wirklich durch, wozu die vielen separaten Javascripte in der Seite nützlich sein sollen?
                          Etwa dazu, dass der Seitenaufbau bei mir ewig dauert und bei jeder Fenstergrößenänderung wieder?

                          Wozu überhaupt das Javascript um die Bilder ins Dokument zu schreiben?

                          if (i == 1 ) bildunterschrift = " Homebase Thomas ";

                          Stattdessen könnte im Dokument auch Folgendes stehen:

                          <li><a href="fotos.php?id=transafrika_001"><img src="small/transafrika_001.jpg"></a>Homebase Thomas</li>

                          Selbst bei handgeschriebenen Seiten wäre das nicht wirklich aufwändiger, und du verwendest PHP.

                          Das ganze dann im zentralen CSS formatiert.
                          Und für die Anzeige der großen Bilder bei aktiviertem Javascript dann so etwas, wie Lightbox JS oder js_popup.

                          Übrigens, bei meinem Test funktioniert es.

                          Auf Wiederlesen
                          Detlef

                          --
                          - Wissen ist gut
                          - Können ist besser
                          - aber das Beste und Interessanteste ist der Weg dahin!
                          1. Hi,

                            Nachdem display:inline nur funktioniert solange ich kein <br> verwende erstelle ich nun an stelle von divs viele zweizeilige Tabellen und erhalte auch beim IE das gewünschte Ergebnis.

                            Ich weiss Tabellen sind böse aber sie funktionieren ;)

                            Die Bilder werde ich sobald ich Zeit habe deinem Beispiel entsprechend manuell verlinken. Dazu mach ich mir ne Exceltabelle dann muss ich nicht so viel tippen und kann die Nummerierung einfach runter ziehen :)

                            Danke für eure Hilfe, Tobi

                            1. Hallo Tobi

                              Nachdem display:inline nur funktioniert solange ich kein <br> verwende erstelle ich nun an stelle von divs viele zweizeilige Tabellen und erhalte auch beim IE das gewünschte Ergebnis.

                              Ich weiß nicht, was du ständig falsch machst, ich kann auf meiner Testseite <br>s reinhauen so viele ich will, es bleibst genau so, wie ich will, auch im IE6.

                              Doch, ich weiß es: es sind deine mittels Javascript-Browserweiche ins Dokument geschriebenen Inlinstyles. Wenn du dem IE _nur_ display:inline gibst, dann funktioniert es nicht. Er versteht inline-block zwar nicht wirklich, wenn aber in zwei verschiedenen Regelsätzen einmal display:inline-block und einmal display:inline steht, dann verhält er sich so wie er soll. Mit Inlinestyles wirst du das wohl nie erreichen.
                              Außerdem verhinderst du damit eine vernünftige Anzeige im FF2.

                              Die vielen Bilder stellen eine Liste von Bildern dar, da haben auch <div>s nichts verloren, richtig wäre eine Liste, wie in meiner Testseite.

                              Die Bilder werde ich sobald ich Zeit habe deinem Beispiel entsprechend manuell verlinken. Dazu mach ich mir ne Exceltabelle dann muss ich nicht so viel tippen und kann die Nummerierung einfach runter ziehen :)

                              Wofür hast du eigentlich dein PHP, wenn du die ganzen Bilder manuell ins Dokument schreibst und dazu noch Excel verwenden willst?
                              Dieses Stückchen mit den hochgezälten Bildnamen, dürfte sich mittels PHP doch auch nicht schwerer bauen lassen, als mit Javascript.

                              Auf Wiederlesen
                              Detlef

                              --
                              - Wissen ist gut
                              - Können ist besser
                              - aber das Beste und Interessanteste ist der Weg dahin!