[HTML] - Experten hier?

Asphalt

Moin!

Gibt doch hier sicherlich HTML-Spezialisten, oder?

Ich habe ein Problem, bei dem Ich gerade nicht weiterkomme.
Und zwar beim ausrichten einer Grafik.
Ich will diese fix in der Bildschirm/Browserfenster Mitte haben.

Und nicht mit topmargin="xx" etc. arbeiten.

Als Hintergrundgrafik mit style="background-image:url(grafikname.jpg); background-repeat:no-repeat; background-position:center center; kein Problem.

Nun will Ich die Grafik aber im Vordergrund und als Verweis haben.

Kann mir jemand helfen...?

Gruß,
Jan

Fips

...in eine unsichtbare Tabelle packen?

edit: http://www.selfhtml.org ist geschmeidig

Asphalt

Per selfHTML komm Ich auch nich weiter (das ist ja grundlegendste Grundlage für HTML)
Hab schon diverse tag und style-Kombinationen ausprobiert, aber so ganz schlau wurd Ich nicht.

Ich bekomm das Gnaze einfach nicht genau in die Frame/Bildschirmmitte.
Bzw. nicht per automatischer Ausrichtung. Soll jan icht nur bei mir zentriert sein.

hannes86

Code

<center>bild</center>

Asphalt

Ja, dadurch wird Mitte in abhängigkeit von links & rechts definiert.

Aber Ich will ein Bild in der GEOMETRISCHEN MITTE des/eines Frames platzieren.
Also Mitte aus oben/unten/links/rechts/vorne/hinten.
Das kann doch nich so schwer zu verstehen sein...?

hannes86

Ah, sag dass doch

Code

<table width=100% height=100%>
   <tr>
        <td valign=middle align=center>
	BILD
       </td>
   </tr>
<table>

r0n1N

Ich weiß gar nicht, ob das so wirklich machbar ist. Also wenn du deine Seite auf eine bestimmte Auflösung hin konzipierst dann vllt. Also per unsichtbarer Tabelle, wie schon erwähnt. Dann musst du halt nen biserl mit den Pixeln rumrechnen, aber sollte machbar sein.

Bei ner Variablen Auflösung wirds glaub ich schwierig. Denn so ne Seite is ja quasie Endlos, da gibts mein ich keine vertikale Mitte. Aber beschwören würd ichs nich wollen

Edit: ok, da war wer schneller als ich mit mehr Ahnung :p

Asphalt

Zitat von hannes86

Ah, sag dass doch

Code

<table width=100% height=100%>
   <tr>
        <td valign=middle align=center>
	BILD
       </td>
   </tr>
<table>

Aaaahhh!!! :):D
Die "100%" Definition fehlte mir wohl... Ohne geht's nämlich so nicht.

Herzlichen Dank!

Gruß,
Jan

Bandit

Die Lösung mit der Tabelle mag funktionieren, ist aber wenig elegant und kein valides html...

so ist es auch xhtml valide:
CSS:

Code

#zentriert {
position: absolute;
width: 300px;
height: 200px;
top: 50%;
left: 50%;
margin-top: -100px;
margin-left: -150px;
}

html:

Code

<div id="zentriert">
   <img src="dein_Bild.jpg" width="300" height="200" />
</div>

durch top/left 50% wird das Bild mit der oberen linken Ecke an die Bildschirmmitte ausgerichtet, durch einen negativen Einzug von 50% der Bildbreite/höhe wird es dann mit seinem Mittelpunkt zentriert.

Jetzt mitmachen!