CSS: Fünf Bild (links und recht bündig) in einer Leiste (nebeneinander darstellen)
lima-city → Forum → Die eigene Homepage → Homepage Allgemein
angabe
anliegen
bestimmte anzahl
bild
code
container
display
element
frage
klasse bekommen
last
leiste
letzte last
platz
problem
sache
sagen
schnelle idee
span
verteilen
-
Hallo.
Ich stehe gerade vor dem Problem, dass ich eine Leiste habe, in der i.d.R. fünf Bilder (immer die selbe Größe) nebeneinander Platz finden sollen. Wenn man auf eines der Bilder klickt, dann öffnet sich (per JS) das Bild darunter liegend als großes Bild, welches genau dem Maß der Leiste entspricht.
Das habe ich jetzt so versucht zu lösen, dass jedes Bild eine Klasse bekommen "other", bis auf das letzte "last". Die "other"-Klasse sieht immer eine bestimmte Anzahl von Pixeln rechts von den Bildern als Paddingwert vor. Die "last"-Klasse hat diese nicht (damit sie bündig anliegt.) Allerdings sieht das in verschiedenen Browsern auch unterschiedlich aus.
Jetzt meine Frage: Gib es die Möglichkeit irgendwie direkt einen Code für den ganzen Div-Container zu schrieben, damit ich einfach die fünf Bilder darein machen kann und diese dann autom. über die Leiste verteilt werden und dann links und rechts bündig anliegen?
Das wäre echt der Burner!
Diese ganze Sache mit "other" und "last" ist mir auch irgendwie zu sehr gefrickelt.
Gruß,
m84 -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Das ist jetzt nur eine ungetestete schnelle Idee, die ich wohl probieren würde:
Mach ein großes DIV, sagen wir feste Breite von 800px und text-align:center; Jedes Bild fasst du dann einzeln in einen SPAN (damit es ein inline-Element ist, oder alternativ ein DIV mit display:inline;) und diese sollten sich dann so anordnen, dass das dritte Bild genau in der Mitte zu finden ist und die anderen sich jeweils rechts und links gleichmäßig davon verteilen. Den SPAN der Bilder kannst du ja auch noch mit anderen padding/margin-Angaben versehen um den Abstand zueinander zu beeinflussen. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
