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

relative Positionierung??

Status
Für weitere Antworten geschlossen.
G

g4rg4m3l

Neues Mitglied
hi,

ich hab eine html:

Code: 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<title>Test-Seite</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id=container>
<div id=baner></div>

</div>
</body>
</html>
und eine css:

Code: 
html, body {
    background-color: leightgrey;
    margin:0;
    padding:0;
    height:100%;
}
div#container {
    margin:0 auto;
    width: 800px;
    height: 100%;
    color: black;
    background: blue;
    z-index: 1;
}

div#banner {
    position: relative;
    margin-left: 50px;
    margin-top: 40px;
    width: 700px;
    height: 140;
    background-color: black;
    z-index: 2;
}
wie kann ich machen das sich die Position des Banner und nachfolgender Elemente auf "container" bezieht??

muss noch dazusagen, so wie es jetzt ist, zeigt es das banner nicht an...wiso??
 
Werbung:
Code: 
div#container {
  position:relative;
}
div#banner {
  position:absolute;
}
Und der innere Div wird nicht angezeigt, weil er keinen Inhalt enthält.

btw: Du kannst maximal eine HTML-Datei und eine CSS-Datei haben, aber keine "HTML" und auch keine "CSS".
 
Du hast "baner" in der HTML-Datei falsch geschrieben. Vielleicht hat dich das verwirrt? Außerdem werden die Werte von Attributen mit Anführungszeichen umgeben!

Da der Topictitel von Positionierung spricht nehme ich an du willst ein Element A was per "position: absolute;" positioniert wird innerhalb eines anderen Elements B positionieren? So:

Code: 
<div style="position: relative;"><div style="position: absolute;">positionierter Inhalt</div></div>
 
Werbung:
nein; ich möchte das mein Container so bleibt wie er ist, und das ich das banner und eine navi, auf den linken oberen Punkt des Containers beziehent , positionieren...

zur verdeutlichung: so soll es von der positionierung her aussehen...:

in wie kann ich das banner zentrieren und von oben einen Abstand einrichten?? Wenn ich "margin: 10px auto" mache ist es zwar zentriert und eingerückt, aber der container wird ebenfalls nach unten versetzt...

9224eb01f1bb3490f07456169.gif
 
Zuletzt bearbeitet:
Habs nicht ganz verstanden, aber vielleicht ist

Code: 
margin: 0px auto;padding: 10px 0px;

die Lösung?
 
Tu dir mal den Gefallen und formatiere deinen Code ordentlich.
Dies hier ist jetzt das erste, was mir eingefallen ist...

Code: 
html, body {
    background-color: leightgrey;
    margin:0;
    padding:0;
    height:100%;
}
#container {
    margin: 0 auto;
    width: 800px;
    height: 100%;
    color: black;
    background: blue;
    padding-top: 20px;
}

#banner {
    width: 700px;
    height: 140px;
    
    margin-left: auto;
    margin-right: auto;

    background-color: black;
    border: 1px solid #000;
}
 
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben