Frage zu einer absoluten Positionierung

[MisterS]

Moin

Also ich gebe zu ich bin ziemlich veralte was meinen Standart angeht.
Als ich HTML gelernt hab gabs kein CSS *g
Naja, das lern ich halt grad...

Jetzt hab ich ein Design mit CSS, div Container, umgesetzt und sehe keine andere Möglichkeit den Werbebanner im Header so einzubinden:

<style type="text/css">
.examplediv
{
background-color:#efefef;
border-style:solid #000000 1px;
}
#divid
{
position:absolute;
left:594px; top:51px; width:468px; height:60px;
}
</style>

<div id="divid" class="examplediv">
Hallo
</div>

Geht super, aber ich frage mich was ich machen soll um Browser ünabhängig und Auflösungs unabhängig den Banner an der richtigen Stelle anzuzeigen...
Klar, wen ich meine Auflösung ändere verschiebt der sich.

Jemand einen Tipp wie ich das richtig mache?

 

[Graccem]

Position bezieht sich immer auf das übergeordnete Element, welches positioniert wurde. Ist dieses nicht vorhanden, so wird der Body als Referenz genommen.

Damit also dein position:absolute nicht in der linken oberen Ecke anfängt musst du einfach, dass Element, welches außen um dein Element mit position:absolute ist, ein position:relative mit geben. That's it.

<style type="text/css">
 .examplediv
  {
    background-color:#efefef;
    border-style:solid #000000 1px;
  }
#divid
  {
    position:absolute;
    left:594px; top:51px; width:468px; height:60px;
  }
.relativ
  {
    position:relative;
  }
</style>

<div class="relativ"><!-- Oder ein anderes Element aus deiner Struktur  -->
<div id="divid" class="examplediv">
Hallo
</div>
</div>

 

[MisterS]

Ah, ok danke!
Das mach ich mal so

 

[MisterS]

So, musste mich um meinen kleinen kümmern

Hmh...hab ich jetzt so eingebunden wie du gepostet hast.
Also der Style wird direkt im Header bei mir eingebunden.
Aber er verschiebt sich halt immer noch wen ich meine Auflösung zum testen kleiner machen...schau (auch Quelltext...so wie gepostet...oder flasch gemacht?):

https://web39.585.bces.de/spiele.php

 

[Graccem]

Du musst das schon in deine Struktur integrieren. Du hast jetzt einfach nur vor allem direkt in den Body geschrieben, damit ist der Bezugspunkt immer noch der gleiche.
Pack dein Div in das Div mit der Klasse hh und dann versuche es noch einmal.