• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Positions Problem

Jansinger

Neues Mitglied
Ich verstehe einfach nicht warum der Text wenn er z.b. in einem "h1" oder "p" Tag steht dann UNTER der definierten Box Steht :(

HTML:
  <style type="text/css">
       #testposition { width:400px; height:30px; position:absolute;  top:0px;right:0px;background-color:#bdd;}
  </style>


<body>
      <div id="testposition">
        <h1>Test</h1>
      </div>
</body>
Im Gegansatz dazu ohne Tag dann wirklich auch in der Box !


HTML:
  <style type="text/css">
       #testposition { width:400px; height:30px; position:absolute;   top:0px;right:0px;background-color:#bdd;}
  </style>


<body>
      <div id="testposition">
        Test
      </div>
</body>
mache ich etwas falsch oder woran liegt das ?
 
Moin,

sowohl die h-Überschriften wie auch der p-tag (Block-Elemente) erzeugen einen automatischen Zeilenumbruch. Ersetze das entsprechende tag z.B. mit einem span-tag (Inline-Element), dann hast Du das Problem nicht mehr.

Du hast offenbar wenig Ahnung von den Elementen, hantierst aber schon mit dem position-tag herum. Ein paar Basics dürften Dir wohl nicht schaden, so z.B. von selfhtml.

Grüsse
low
 
lowsaxonian schrieb:
sowohl die h-Überschriften wie auch der p-tag (Block-Elemente) erzeugen einen automatischen Zeilenumbruch. Ersetze das entsprechende tag z.B. mit einem span-tag (Inline-Element), dann hast Du das Problem nicht mehr.

Na ja, sie sind Blocklevel-Elemente die standardmäßig einen oberen Abstandswert (margin-top) gesetzt haben. Durch diesen Abstand ragt das Element über das Rahmen-Div (height: 30px;) hinaus (siehe DrPCox).

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

Der Standardwert für overflow ist glaube ich visible.
 
Ja, hab´s jetzt zu 100% begriffen - typischer Anfängerfehler :idea:

Der Standardwert für overflow ist definitiv visible - wenn es nicht so wäre dann
hätte ich meinen Fehler vermutlich anders beschrieben - z.b.: "ick mag was in die Box
und nix ist zu kucken ;-)))


Vielen Dank für die drei Antworten - Alle führen zum Ziel !!
 
Zurück
Oben