nicht angemeldet
Grafik in div vertikal zentrieren
0 0
Grafik in div vertikal zentrieren
Gunnar BittersmannHallo,
wie kann ich mittels css-Formatierung eine Grafik in einer <div>-Box vertikal zentrieren?
Viele Grüße
Daniel N.
-
hallo,
wie kann ich mittels css-Formatierung eine Grafik in einer <div>-Box vertikal zentrieren?
Indem du die entsprechenden Angaben in der Forums-FAQ zur Kenntnis nimmst.
Grüße aus Berlin
Christoph S.
-
Hi,
ok, vielleicht hätte ich mit der Forums-FAQ mein Problem lösen können müssen.
Ich habe diese wohl gelesen, leider hilft mir das nur bedingt weiter. Meine Angaben zur Problemstellung waren aber wahrscheinlich auch viel zu ungenau:Ich habe folgende HTML-Struktur:
<div>
<img ... />
<p>Absatz 1</p>
<p>Absatz 2</p>
<p>Absatz 3</p>
<p>Absatz usw.</p></div>
Meine Darstellung (mit css) soll wie folgt aussehen:
- der Text soll rechts um das Bild fließen
- die Grafik soll im umschließenden <div> vertikal zentriert sein.Wie könnte das zugehörige css aussehen?
Daniel
hallo,
wie kann ich mittels css-Formatierung eine Grafik in einer <div>-Box vertikal zentrieren?
Indem du die entsprechenden Angaben in der Forums-FAQ zur Kenntnis nimmst.
Grüße aus Berlin
Christoph S.
-
hallo,
ok, vielleicht hätte ich mit der Forums-FAQ mein Problem lösen können müssen.
Ich habe diese wohl gelesen, leider hilft mir das nur bedingt weiter.Vermutlich, weil du dich nicht bis zu http://de.selfhtml.org/html/grafiken/ausrichten.htm#css durchgelesen hast.
Ich habe folgende HTML-Struktur:
In der das <div> keine Existenzberechtigung hat.
- der Text soll rechts um das Bild fließen
- die Grafik soll im umschließenden <div> vertikal zentriert sein.Ist das nicht ein _wenig_ widersprüchlich?
Grüße aus Berlin
Christoph S.
-
Hello out there!
In der das <div> keine Existenzberechtigung hat.
Doch, es gruppiert ein Bild und einige Textabsätze. Wenn es die einzige Gruppe wäre ...
<body> <div> <img/> <p/> <p/> <p/> <p/> </div> </body>... dann wäre es aber überflüssig.
- der Text soll rechts um das Bild fließen
- die Grafik soll im umschließenden <div> vertikal zentriert sein.Ist das nicht ein _wenig_ widersprüchlich?
Nicht ein bisschen:
┌────────────┐ │Lorem ipsum │ │dolor sit │ ├────┐amet, │ │░░░░│conse- │ ├────┘tetur │ │sadipscing │ │elitr. │ └────────────┘Nur sind Browser keine DTP-Programme; es ist mit HTML und CSS nicht zu erreichen.
Bleibt nur, in etwas abzuschätzen, wo im Text die Mitte ist ist und das Bild dementsprechend im Quelltext einzufügen:
<p>Lorem ipsum dolor sit <img/> amet, conse­tetur sadipscing elitr.</p>See ya up the road,
Gunnar--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)-
Nicht ein bisschen:
┌────────────┐
│Lorem ipsum │
│dolor sit │
├────┐amet, │
│░░░░│conse- │
├────┘tetur │
│sadipscing │
│elitr. │
└────────────┘Das ist mit CSS so nicht möglich. Du kannst das Bild an eine bestimmte (Text-)Stelle packen oder einen beliebigen Abstand von oben wählen, aber vertikal \_zentrieren\_ geht nicht.-
Hi,
ich würde eher sagen mit HTML und CSS kann man kein DPT machen, aber lassen wir dass ;-)
Mir ist auch bewusst, dass das eine <div> prinzipiell überflüssig ist. Ich hatte dieses eingefügt, um den umschließenden <div> in zwei Spalten aufteilen zu können.
Nun müsste ich mir natürlich eigentlich noch überlegen, wie das semantisch eine vernünftige Bedeutung kriegt...Mein Kunde wünscht auf einer Startseite u. a. eine Vistitenkarte, die so ähnlich aussieht wie schon beschrieben wurde:
┌────┐────────────────────┐ │ │ Vorname Nachname │ │ │ Strasse │ │░░░░│ PLZ, Ort │ │░░░░│ │ │ │ Tel 1234 456789 │ │ │ vorname@nachnamede│ └────┘────────────────────┘Viele Grüße
Daniel-
hi,
Mein Kunde wünscht auf einer Startseite u. a. eine Vistitenkarte, die so ähnlich aussieht wie schon beschrieben wurde:
┌────┐────────────────────┐
│ │ Vorname Nachname │
│ │ Strasse │
│░░░░│ PLZ, Ort │
│░░░░│ │
│ │ Tel 1234 456789 │
│ │ vorname@nachnamede│
└────┘────────────────────┘Da sehe ich ein Element, welches die Adressdaten enthält, die mit etwas padding-left auf Abstand gehalten werden - und ein nicht gekacheltes Hintergrundbild, welches mit left center ausgerichtet wird. gruß, wahsaga -- /voodoo.css: #GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi wahsaga,
vielen Dank für die Hilfe. Genau so ein Denkanstoss hat mir gefehlt!
Manchmal denkt man einfach zu kompliziert ;-)Daniel
-
-
-
-
-
-
-