Aybee: Gallerie mit float

Beitrag lesen

Hallo Benjamin,

zumindest meine Vorschaubildchen sind auch immer gleich groß. Außerdem können durchaus kleinere Bilder in den Boxen untergebracht werden, das sollte nicht stören.

ja schon, aber wenn sie nicht gleich groß sind, sind sie eben nicht untenbündig ausgerichtet.

Warum nimmst du ein Inline-Element (span) und machst daraus ein Block-Element. Da kannst du doch direkt div nehmen. Oder hat das was mit Semantic zu tun?

Nein, nur mit der Darstellung in alten, evtl. CSS-unfähigen Browsern. Oder mit Leuten, die mein Autorenstylesheet nicht sehen wollen. Oder oder oder... Der Unterschied ist hier der, dass die Bilder dort dann auch nebeneinander platziert werden, weil eben Inline, anstatt alle untereinander.

Ah ja, weit mitgedacht.

Meine Herangehensweise hier im Forum ist meistens die, dass ich versuche wirklich auf die Wünsche des Fragenden einzugehen und ihm nichts anderes aufzuschwatzen versuche. Ich würde meine Bilder auch nicht so präsentieren, aber interessant ist es schon. Und es ist auch immer wieder eine Herausforderung ein Problem zu lösen, ob es nun Sinn macht oder nicht. Allerdings rate ich auch von manchen Dingen ab, wenn z.B. klar zu erkennen ist, dass es eine einfachere Lösung gibt.

Wenn du eine Lösung der Problemstellung ohne Tabellen kennst, lass es mich wissen. Ich habe mir die Seite mit dem Tanzclub angesehen, und auf den ersten Blick sah es so aus, als hätte hier jemand eine Lösung gefunden. Ich habe den Quelltext kopiert und die Bildgrößen verändert und siehe da, es war nur noch ein Kuddelmuddel. Kannst dir untenstehenden Quelltext so wie er ist in deinen Editor laden und ansehen.

Es kommt gleich auch noch eine erweiterte Lösung von mir, auch wieder mit Tabellen, die ist dann noch schlechter als meine erste.;-)

Erfüllt aber die Bedingungen.

  
<html>  
<head>  
   <title>TD Rot-Weiss e.V.: Turnierpaargruppe Standard</title>  
   <link rel="stylesheet" type="text/css" href="http://www.td-rot-weiss-duesseldorf.de/tdtext.css" />  
<!--[if IE]><style type="text/css">@import url(http://www.td-rot-weiss-duesseldorf.de/td-scrollbar.css);</style><![endif]-->  
<style type="text/css">  
  @import url(http://www.td-rot-weiss-duesseldorf.de/tdblock.css);  
  img { border:0; }  
</style>  
<script type="text/javascript" src="http://www.td-rot-weiss-duesseldorf.de/tdframe.js"></script>  
</head>  
  
<body onload="TDframe(self.location.href)">  
<p class="Layout">Ihr Browser unterst&uuml;tzt leider nicht den <a href="http://www.td-rot-weiss-duesseldorf.de/news/news030526.html">aktuellen Standard</a><br />der zur korrekten Anzeige dieser Seite vorausgesetzt wird!</p>  
  
<h2>Standard-Turnierpaare</h2>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-cremer.jpg" alt="Foto Standard-Turnierpaar" height="150" width="50" /><br /><span>Michael Cremer /<br />Ilka Schmidt<br /><span>A-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="BlindDiv" style="line-height:33px;">&nbsp;<br /></div><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-defayay.jpg" alt="Foto Standard-Turnierpaar" height="100" width="100" /><br /><span>Patrick Defayay /<br />Sara Wagner<br /><span>S-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-gross.jpg" alt="Foto Standard-Turnierpaar" height="50" width="50" /><br /><span>Rahim Gro&szlig; /<br />Maria Gro&szlig;<br /><span>D-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-hellmann.jpg" alt="Foto Standard-Turnierpaar" height="120" width="80" /><br /><span>Stefan Hellmann /<br />Annika Herweg<br /><span>C-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-malmstroem.jpg" alt="Foto Standard-Turnierpaar" height="80" width="130" /><br /><span>Jens Malmstr&ouml;m /<br />Martina Nefe<br /><span>Turniervorbereitung Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-privou.jpg" alt="Foto Standard-Turnierpaar" height="60" width="80" /><br /><span>Peter Privou /<br />Helga Privou<br /><span>Sen II / S<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-schubert.jpg" alt="Foto Standard-Turnierpaar" height="40" width="90" /><br /><span>Konrad Schubert /<br />Gudrun Schubert<br /><span>Sen II / S<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-trotzke.jpg" alt="Foto Standard-Turnierpaar" height="120" width="80" /><br /><span>Mark Trotzke /<br />Anke Kresin<br /><span>B-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="BlindDiv" style="line-height:23px;">&nbsp;<br /></div><div class="Umrahmung"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-boddenberg.jpg" alt="Foto Standard-Turnierpaar" height="130" width="20" /><br /><span>J&ouml;rg Boddenberg /<br />Nina Lungershausen<br /><span>A-Standard<br /><span>&nbsp;</span></span></span></div></div>  
  
<div class="Galerie"><div class="Umrahmung"><a href="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-cremerius.html"><img src="http://www.td-rot-weiss-duesseldorf.de/sportbereich/istd-cremerius.jpg" alt="Foto Standard-Turnierpaar" height="90" width="50" /><br /><span>Hans Cremerius /<br />Ingrid Cremerius<br /><span>Sen III / S<br /><span>&raquo; Paarportrait &laquo;</span></span></span></a></div></div>  
  
<p class="clear"><br /></p>  
  
</body>  
</html>

Gruß von Aybee

0 60

Gallerie mit float

Johannes Walther
  • css
  1. 0
    Ole
    1. 0
      Johannes Walther
      1. 0
        Russe
  2. 0
    nag
    1. 0
      Johannes Walther
  3. 0

    "Gallerie" mit float, da floatet mir dieselbige über!

    Gernot Back
    1. 0

      Mir floaten da noch ganz andere Dinge über...

      Benjamin Wilfing
      • menschelei
      1. 0
        Gernot Back
        1. 0
          Jörg Lorenz
          1. 0
            Gernot Back
            1. 0
              Jörg Lorenz
          2. 0
            Alexander Brock
            1. 0
              Benjamin Wilfing
              1. 0
                Gernot Back
              2. 0
                Jörg Lorenz
                1. 0
                  Gernot Back
                  1. 0
                    Benjamin Wilfing
                  2. 0
                    Jörg Lorenz
                    1. 0
                      Gernot Back
                    2. 0
                      WebViper
                      1. 0
                        Jörg Lorenz
                      2. 0
                        at
                  3. 0
                    Orlando
              3. 0
                Alexander Brock
            2. 0
              Jörg Lorenz
              1. 0
                Gernot Back
                1. 0
                  Jörg Lorenz
            3. 0
              Fabian Transchel
              1. 0
                Benjamin Wilfing
      2. 0
        O'Brien
    2. 0
      Johannes Walther
      1. 0
        Gernot Back
        1. 0
          Jörg Lorenz
          1. 0
            Benjamin Wilfing
            1. 0
              Jörg Lorenz
              1. 0
                at
  4. 1

    Galerie mit float

    Gunnar Bittersmann
    1. 0
      Detlef G.
      1. 0
        Detlef G.
      2. 0
        at
        1. 0
          Detlef G.
          1. 0
            at
  5. 0
    Aybee
    1. 0
      Benjamin Wilfing
      1. 0
        Aybee
        1. 0
          Benjamin Wilfing
      2. 0
        Aybee
        1. 0
          Benjamin Wilfing
          1. 0
            Aybee
            1. 0
              Ingo Turski
              1. 0
                Aybee
                1. 0
                  Ingo Turski
            2. 0
              Benjamin Wilfing
              1. 0
                Aybee
    2. 0
      Aybee
  6. 0
    Ingo Turski
    1. 0
      Johannes Walther
      1. 0
        Ingo Turski
  7. 0

    & (JavaScript) Noch ein Lösungsansatz, wenn auch nicht der schönste[tm]

    Ole