[HTML] Div zentrieren mit links und rechts je einem 100% Img

[faux]

Hallo!

Ich will folgendes Boxen-Layout per DIV und CSS darstellen:

Code:

+------------+---------------------------------------------+------------+
|            |                                             |            |
|            |                                             |            |
|  <img />   |                    <img />                  |   <img />  |
|            |                                             |            |
+------------+---------------------------------------------+------------+
              <--                  870px                 -->

<--                                100%                               -->

Es soll also zentriert ein Image mit fixer Breite angezeigt werden und links und recht davon jeweils ein Image mit variabler Breite.
Das ganze soll so wie www.e-faux.com oben aussehen, jedoch mit DIVs anstatt der Tabelle.

Bekomme das leider nicht hin; probiere schon fast ne Stunde. :cry:

Grüße
Faux

[3_of_8]

Du könntest beim mittleren <img /> den left und right-Margin auf auto stellen und davor und danach die anderen <img />s (evtl. mit inline) reintun. Das müsste eigentlich jeder *normale* Browser verstehen.

[S2B]

Das ist in diesem Fall viel einfacher:

Code:

<div style="background-color: url(pfad/zum/hintergrundbild.jpg); text-align: center">
  [img]pfad/zum/bild.jpg[/img]
</div>

Sollte normal funktionieren.

[faux]

Zitat:

Zitat von S2B

Das ist in diesem Fall viel einfacher:

Code:

<div style="background-color: url(pfad/zum/hintergrundbild.jpg); text-align: center">
  [img]pfad/zum/bild.jpg[/img]
</div>

Sollte normal funktionieren.

Stimmt. Danke! :)
Danke text-align funktioniert bei Images nicht. :gruebel:

Jetzt hätte ich allerdings nochmals die selbe Frage, jedoch für den Text darunter. Selbe Situation, jedoch Text, der auf die Seite zentriert sein soll, selbst aber linksbündig.

Grüße
Faux

[S2B]

Zitat:

Zitat von faux

Danke text-align funktioniert bei Images nicht. :gruebel:

Also bei mir funktioniert es (Mit XHTML Transitional-Doctype).

Zitat:

Zitat von faux

Jetzt hätte ich allerdings nochmals die selbe Frage, jedoch für den Text darunter. Selbe Situation, jedoch Text, der auf die Seite zentriert sein soll, selbst aber linksbündig.

*verwirrt*

meinst du sowas:

Code:

h1 {
  text-align: center
}

[3_of_8]

Text-align bezieht sich auf Subelemente. <img> kann keine Subelemente haben, daher funktioniert text-align auch nicht.

[S2B]

In meinem Beispiel ist <img /> auch ein Subelement vom <div>. :angel2:

[3_of_8]

Dann liegt es wohl daran, dass <img /> ein Block-Element ist und Text-align nur mit Inline-Elementen funktioniert.

[S2B]

http://de.selfhtml.org/html/grafiken/einbinden.htm

Zitat:

Grafiken sind aus HTML-Sicht Seite Inline-Elemente. In der "Strict"-Variante von HTML müssen solche Elemente innerhalb von Seite Block-Elementen vorkommen, etwa in einem Textabsatz oder einem allgemeinen Bereich oder auch einer Tabellenzelle.

Es müsste also funktionieren, tut es bei mir auch...

[pacman1986]

Delphi-Quellcode:

<div style="background-color: url(hintergrundbild);">
  <cener>[img]hauptbild[/img]</center>
</div>

so hat es bei mir gefunzt

bei der 2 Frage align="center" und bei style="text-align:left"