Bild mittig setzten

[perle93]

Hallo, ich würde gerne mit meinem vorhandenem Code das Logo Bildschirmunabhängig immer in der Mitte platzieren. Nun ist es so, das ich in dem Code mehr als nur ein Div habe, aber seht selbst.
Mit "align=center habe ich es probiert, aber klappte nicht wie gewünscht.

<a style="position:absolute; top: 350px; left: 250px;" href="http://www.mmm/seiten/news.htm" onmouseover="window.document.images[0].src = 'bilder/mmm_kontur.png'" onmouseout="window.document.images[0].src = 'bilder/mmm.png'">
<img src="bilder/mmm.png" border="0"  width="780" height="100"></a>

Vielen Dank

 

[perle93]

Noch eine Frage zu "Anker" Verlinkungen. Ich würde gerne eine Grafik nutzen, wie oben auch als mouseover mit einer Verlinkung auf einen Text. Ich finde nun einiges bei google, etc., aber ich bekomme es nicht hin, weil mir immer nur der erste Teil angezeigt wird, also wohin der Anker gehen soll, z.B. oben. Oben ist ja nun vielleicht für HTML klar definiert und die Seite springt nach oben, ich würde gerne auf eine bestimmte px Höhe den Link setzen, oder auf das Textfeld. Muss ich dem Textfeld einen Namen geben?

Danke euch

 

[zenturio]

Hallo, ich würde gerne mit meinem vorhandenem Code das Logo Bildschirmunabhängig immer in der Mitte platzieren. Nun ist es so, das ich in dem Code mehr als nur ein Div habe, aber seht selbst.

Wo? Dort? Oder doch woanders? :suspekt:

Mit "align=center habe ich es probiert, aber klappte nicht wie gewünscht.

<a style="position:absolute; top: 350px; left: 250px;" href="http://www.mmm/seiten/news.htm" onmouseover="window.document.images[0].src = 'bilder/mmm_kontur.png'" onmouseout="window.document.images[0].src = 'bilder/mmm.png'">
<img src="bilder/mmm.png" border="0"  width="780" height="100"></a>

Wundert es dich wirklich, bei deinen absoluten Positionsangaben? :suspekt:

 

[flankenkiller]

... denn sie wissen nicht, was sie tun ;-)

 

[perle93]

Ja, die absolute Position soll ja nicht mehr sein, daher die Änderung... deswegen frage ich ja hier.

 

[hela]

Also nochmal die Fragen, die eigentlich schon gestellt wurden:

Hallo, ich würde gerne mit meinem vorhandenem Code das Logo Bildschirmunabhängig immer in der Mitte platzieren.

Wovon die Mitte?

Nun ist es so, das ich in dem Code mehr als nur ein Div habe, aber seht selbst.

Welches DIV meinst du? In deinem Beitrag sehe ich kein DIV.

Mit "align=center habe ich es probiert, aber klappte nicht wie gewünscht.

Wo bitte hast du das versucht?

 

[perle93]

ich möchte gerne das Logo Bildschirmunabhängig immer in der Mitte haben. Also auf einem 15" in der Mitte so auch beim 30" Bildschirm. Ah, da war kein Div, stimmt,-) Und probiert habe ich es bei mir auf der Seite, aber es klappte nicht, deswegen frage ich hier... Ich muss die absolute ja ändern in ein center, oder was anderes. Weiss nicht genau in was ich es ändern muss und wo im Code.

 

[iBirne]

CSS Code

position: absolute;
width: BREITE VOM DIV px;
height: HÖHE VOM DIV px;
left: 50%;
top: 50%;
margin-left: - HALBE BREITE VOM DIV px;
margin-top: - HALBE HÖHE VOM DIV px;

Sollte normalerweise funktionieren.
Die großgeschriebenen Werte müssen natürlich durch die Pixelangaben ersetzt werden.

 

[perle93]

danke dir, das sieht schon gut aus, aber er geht nicht von oben runter auf die Mitte. Der Code sieht nun so aus.

<a style="position:position: absolute;width: 780px;height: 100px;left: 50%;top: 50%;margin-left: 125px;margin-top: 175px;" href="http://www.mm/seiten/news.htm" onmouseover="window.document.images[0].src = 'bilder/mm_kontur.png'" onmouseout="window.document.images[0].src = 'bilder/mm.png'"><img src="bilder/mm.png" border="0"  width="780" height="100"></a>

 

[sonntagsprediger]

Dabei hast du eine Vorgabe erhalten, in die du lediglich die passenden Werte einzusetzen hattest.

Die margin-Angaben erhalten zum einen bei dieser Positionstechnik immer ein negatives Vorzeichen, um die Box im Viewport nach links und oben zu verrücken, denn die Angabe "50%" bezieht sich auf den oberen und linken Boxenrand, womit sie "außermittig" im Vewport sitzt, und die beiden Werte betragen immer die Hälfte von der Boxenbreite und -höhe.

position:position: absolute; /* ein position: ist hier zuviel */
width: 780px;
height: 100px;
left: 50%;
top: 50%;
margin-left: -390px; /* neg. Hälfte von width:780px */
margin-top: -50px; /* neg. Hälfte von height:100px */

Siehe hierzu auch das passende Beispiel http://d-graff.de/selfhtml/center1.html .