Bild mittig einbauen - Lösungen gsucht

[Kermit]

Ich versuche schon seit längerem für eine Page ein Bild total mittig zu setzen, d.h. vertikal und horizontal.
Absolute pixelangaben gehen nicht weil es bei verschiedenen Bildschirmauflösungen in der gleichen Position bleiben soll, und als Hintergrundbild fixieren geht auch nicht, da ich bereits einen Hintergrund habe.

Was gibt es noch für Lösungen?

[Dr.Death]

Laut google so:

HTML
http://www.snippetcenter.org/en/inhalt- ... n-s76.aspx

CSS:
http://www.tutorials.de/forum/css/23956 ... chten.html

[Kermit]

Spitze, vor allem die css Lösung.
Ich habe es dann in dieser Version verwendet.
Code in der CSS Datei:

Code: Alles auswählen

#cover {position:absolute;
        top:50%;
        left:50%;
        width:300px;
        height:500px;
        margin-left:-150px;
        margin-top:-250px; }   /* Startbild mittig ausrichten*/

und zum einbinden in der Page:

<div id="cover"></div>

[Boecki91]

ich glaube den div-Container kannst du dir sogar sparen

<img id="cover" ...>

[Xwitz]

@ Kermit, das steht sogar in den FAQ von selfhtml.org.
http://de.selfhtml.org/navigation/faq.h ... te_inhalte

[Elen]

Hallo!

Ich nutze den Thread mal, weil ich dasselbe Problem habe.
Allerdings hat es bei mir mal funktioniert und lediglich die URL-Änderung
des Bildes hat bewirkt, dass es nun in der Box immer links ist, anstatt mittig.
Wie kann das denn sein?

Hier mal der Code:

Code: Alles auswählen

<div class="forabg">
   <div class="inner">
      <span class="corners-top"><span></span></span>
      <ul class="topiclist">
         <li class="header"><dl><dt>Okey-Doggy Fotowettbewerbsgewinner</dt></dl></li>
      </ul>
      <ul class="topiclist forums">
         <li><dl>
            <dd class="posts_portal"  style="border-left:0px">
              <div align="center">
                <!-- Add your Code here -->
                <div align="center"><a href="http://www.okey-doggy.de/gallery/index.php" target="_blank"><img src="http://img516.imageshack.us/img516/1541/okjessium1.jpg" width="80%" height="80%" alt="Okey-Doggy Gallery" border="0" align="center"></a></div>
              </div>
            </dd>
         </dl></li>
      </ul>
      <span class="corners-bottom"><span></span></span>
   </div>
</div>
<br style="clear:both" />

Bitte habt Nachsicht mit mir, da ich noch neu auf dem Gebiet bin.

Gruß,
Elen