[CSS] Bild zentriert im div Container

[Matthiasnet]

Hallo,

dreh schon langsam am Rad deswegen und bin mttlerweile Selbstmordgefährdet bzw. überlege ich das ganze Design in Tabellen zu machen weil ich es nicht hinbekomme, ein Bild vertikal zu zentrieren-.-

Hab mir die Funktionen von CSS 3 mal durchgelesen und bei google konnte mir auch nichts helfen....
und zwar folgendes habe ich:

<div style="width:240px; float:left; border:1px solid #000000; margin:4px;">
<div align="center" style="width:90px; float:left; border-right:1px solid #000000; height:70px; vertical-align:middle;">
<a href="url">bild</a>
</div>

<div style="width:145px; float:left; margin-left:1px">text</div>
</div>

Da min-height auch leider nicht klappt, musste ich auf heigh umsteigen....wenn mir jemand bei diesme Problem weiterhelfen könnte, wär ich im wirklich sehr verbunden....hab schon alle Kombinationen 3 mal getestet

Grüße

Matthiasnet

 

[Bububoomt]

vertical align middle geht in fast keinem Browser wenn die tabelle stimmt:


https://www.css4you.de/Texteigenschaften/vertical-align.html

versuch mal valign

 

[Matthiasnet]

vertical align middle geht in fast keinem Browser wenn die tabelle stimmt:


https://www.css4you.de/Texteigenschaften/vertical-align.html

versuch mal valign

ja da steht ja mehrmals middle drin, hatte gehofft es ist einer von den oberen, dass in den meisten funktioniert...
Aber wo soll ich den valign einsetzen? Das wär ja für ein Tabellenlayout aber ist doch kein Gültiges Attribut für einen div Container oder?

 

[Astrodan]

Hab mir auch schon oft Gedanken darüber gemacht, aber ist leider wohl nicht so einfach möglich. Wobei es eine Methode gibt, die funktioniert.

Schau dir aber doch einfach mal diesen Thread an. Dreht sich im Prinzip um das, was du willst!

 

[Matthiasnet]

Adiós div Container y CSS....ich steig auf Tabellen um
Bevor ich soviel machen muss (und die Bilder haben alle eine unetrschiedliche Höhe und ist sonst komplett dynamisch) nimm ich es lieber auf mich das ganze Design aufgrund der mittigkeit in Tabellen zu machen^^

 

[Astrodan]

Adiós div Container y CSS....ich steig auf Tabellen um
Bevor ich soviel machen muss (und die Bilder haben alle eine unetrschiedliche Höhe und ist sonst komplett dynamisch) nimm ich es lieber auf mich das ganze Design aufgrund der mittigkeit in Tabellen zu machen^^

och, dynamisches auslesen per Javascript ist auch nice
Musst du aber wissen. Ich persönlich würde meine Website, sobald ich sie dreispaltig will, auch mit Tabellen machen. Wobei ich einmal bisher ein Layout hingekriegt hab, das sowohl der IE6 als auch der FF richtig angezeigt haben, und das mit divs. Allerdings war es sehr immun gegen Änderungen

 

[Matthiasnet]

lol das kommt vor allem dann sehr gut wenn man null Ahnung von JS hat^^
Naja denke mal das wegen deinen angesprochenen Gründen Tabellen doch besser sind...scheint mir noch, dass die Browser noch nciht so weit sind...

 

[ZeroCCC]

vertical align middle geht in fast keinem Browser wenn die tabelle stimmt:


https://www.css4you.de/Texteigenschaften/vertical-align.html

versuch mal valign

doch das unterstützen viele browser... das problem ist nur das viele nicht verstehen was es macht. vertical-align richtet ein ellement in einer zeile aus und nicht die zeile in einem ellement.

zb:

das ist nen text mit nem BILD und das bild ist im textfluss

und jetzt könnte man dem BILD die eigenschaft vertical-align geben und es würde sich in der zeile so ausrichten wie angegeben.

CONTAINER das ist nen text mit nem BILD und das bild ist im textfluss CONTAINER

würde man hier den container vertical-align geben würde gar nix passieren. da vertical-align sich immer auf den textfluss bezieht in dem das ellement ist und nicht auf dessen inhalt. und da der container ein bock ellement und somit in keinem textfluss ist passiert rein gar nix.

 

[Cosmoflamme]

Warum sollte das mit CSS nicht gehen?Ist auch nicht komplizierter,als mit ollenTabellen:

#center { position:absolute; left:50%; width:800px; height:600px; margin-left:-400px;}

margin-left ist dabei die Hälfte der Container-Breite.Das selbe Prinzip kannst Du
dann mit der Höe veranstalten.Und .....voila...hast Du einen mittig zentrierten CSS-Container.

 

[Matthiasnet]

Aber dieses Beispiel kann man nicht auf meine Bedürfnisse anpassen, da zum einem beliebig viele Div Container erstellt werdem müssen (je nachdem wieviele Datensätze aufgerufen werden) und diese haben dazu auch noch eine unterschiedliche höhe...weshalb man sie auch nicht absolut setzen kannw ie du es gemacht hast
(Hab es nicht getestet, aber denke mal das es schon so richtig ist wie ich es gesagt ahbe)

 

[perlini]

Wie wäre es damit:

<div style="border:1px solid;width:300px;background:url(deinbild.jpg) no-repeat center;height:300px;"></div>