Grafik mittig ausrichten mittels css

[Carsten Preuß]

Hallo,

bei Text ist es text-align: center;, das den betreffenden Abschnitt mittig ausrichtet.
Nun ist eine Grafik aber kein Text, wie hat hier die Anweisung zu lauten?

[GodLike]

Hallo,

bei Text ist es text-align: center;, das den betreffenden Abschnitt mittig ausrichtet.
Nun ist eine Grafik aber kein Text, wie hat hier die Anweisung zu lauten?

Hallo,

das wäre meine Lösung:

  
<div style="width:100%;padding-left:auto;padding-right:auto;text-align:center;">  
<img src="xyz.gif" width="x" height="y" alt="text">  
</div>  

Das text-align ist für den IE der kommt mit dem padding nicht so gut zu recht.
Was wird hier gemacht?
Zuerst eine div Box die so breit ist wie der Eltern-Container und den Inhalt mittig platziert.

GodLike

[rfb]

Moin

<div style="width:100%;padding-left:auto;padding-right:auto;text-align:center;">
<img src="xyz.gif" width="x" height="y" alt="text">
</div>

...  

> Was wird hier gemacht?  
> Zuerst eine div Box die so breit ist wie der Eltern-Container und den Inhalt mittig platziert.  

Ziemlich umständlich. Wenn du schon das Bild wie ein Blockelement behandeln willst solltest du ihm einfach mit display:block entsprechende Eigenschaften geben, statt ein unnützes DIV einzusetzen.  
  
  
  
Gruß  
rfb

-- 
Man kann einen Menschen nichts lehren, man kann ihm nur helfen, es selbst zu entdecken.  
(Galileo Galilei)

[rfb]

Moin

bei Text ist es text-align: center;, das den betreffenden Abschnitt mittig ausrichtet.
Nun ist eine Grafik aber kein Text, wie hat hier die Anweisung zu lauten?

Solange du für die Grafik nichts anderes angibst behandelt der Browser sie als (Text-)Zeichen.
Insofern ist text-align:center korrekt.

Gruß
rfb

[GodLike]

Moin

bei Text ist es text-align: center;, das den betreffenden Abschnitt mittig ausrichtet.
Nun ist eine Grafik aber kein Text, wie hat hier die Anweisung zu lauten?
Solange du für die Grafik nichts anderes angibst behandelt der Browser sie als (Text-)Zeichen.
Insofern ist text-align:center korrekt.

Gruß
rfb

Bei mir macht das dann nur der IE(6). text-align ist eigentlich _nur_ für _Text_ vorgesehen, aber der IE wendet text-align auch auf andere Sachen an z. B. Bilder. Mit meinem Code ist man aber m. E. auf der sicheren Seite.

GodLike

[Detlef G.]

Hallo GodLike

Bei mir macht das dann nur der IE(6).

Seltsam, bei mir machen es alle Browser richtig.

text-align ist eigentlich _nur_ für _Text_ vorgesehen,

Nein, für Elemente, die inline sind.
SELFHTML: text-align unter "Beachten Sie:"
This property describes how inline content of a block is aligned.
The IMG element has no content; it is usually replaced inline ...
                                                       ^^^^^^

Auf Wiederlesen
Detlef

[rfb]

Moin

Bei mir macht das dann nur der IE(6).

welche anderen Browser nutzt du denn, die das nicht verstehen?

text-align ist eigentlich _nur_ für _Text_ vorgesehen,

das ist einfach falsch

aber der IE wendet text-align auch auf andere Sachen an z. B. Bilder.

das soll er auch. Fehlerhaft ist die Anwendung auf Blockelemente, die auch eine Spezialität aus dem Hause Microsoft ist.

Mit meinem Code ist man aber m. E. auf der sicheren Seite.

wie war das mit den Kanonen und den Spatzen?

Gruß
rfb