Hallo,
ich versuche gerade 3 Bilder anzuordnen.

2 sollen nebeneinander sein und das dritte sollte zentriert darunter sein.


Ich habe nun folgendes gemacht:

HTML:
<div id="contentpic">
<img src="images/XX.jpg" /> <img src="images/XY.jpg" />
</div>


<div id="contentpicmid">
<img src="images/YY.jpg"/>
</div>

CSS:
#contentpic img {display:inline; width:40%; height:auto; margin-left:auto; margin-right:auto; }
#contentpicmid img {display:block; width:40%; margin-left:auto; margin-right:auto; height:auto;}


Jetzt macht er XX und XY in eine Zeile aber richtet es links aus. YY.jpg ist mittig ausgerichtet.
Jetzt würd ich gerne die 2 ersten Bilder also XX.jpg und XY.jpg zusammen wieder mittig ausrichten. Wie geht das?

Wenn ich den #contentpicmid img auch über die ersten beiden Bilder lege, dann macht er sie wieder untereinander... wahrscheinlich wegen dem display:block;....
#contentpic {display:block;margin-left:auto; margin-right:auto;}
#contentpic img {display:inline; width:40%; height:auto; margin-left:auto; margin-right:auto;}
#contentpicmid img {display:block; width:40%; margin-left:auto; margin-right:auto; height:auto;}

hier bleiben auch XX.jpg und XY.jpg linksbüdig....



Gruss, mofi

Hallo!

Warum so umständlich?
Das hier sollte doch reichen, oder nicht?

Edit fiddle - JSFiddle

__________________
Gruß schatzi

Oder simpler:
Edit fiddle - JSFiddle

__________________
MfG
Jens

Klar!
Wenn die DIVs nicht noch für irgendetwas anderes benötigt werden, dann reicht das natürlich auch schon aus.

__________________
Gruß schatzi

ich hatte das text-align:center; im pic img {text-align:center;}.... funktion blieb aber aus.... deswegen dacht i es muss umständlicher sein...

danke euch zwei.....