Gunnar Bittersmann: Grafik in div vertikal zentrieren

Beitrag lesen

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&shy;tetur sadipscing elitr.</p>

See ya up the road,
Gunnar

--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)