✔ div verschachteln

Status
Nicht offen für weitere Antworten.
Bringt nix. Zeitweise verschluckt jetzt auch der ie die paddings.

es wird als modus immer cs1compat ausgegeben

also die ganze definition kommt mir merkwürdig vor. wenn ich das setze

.mainmenu {
padding: 7px 100px 7px 10px;

dann richtet er den text auf einmal ach links aus und fliegt aus dem div nach links raus. das kann wohl kaum logisch sein
 
habs jetzt hinbekommen aber jetzt gehts gleich weiter. ich möchte unten drunter einen div footer aber er packt das dingjetzt immer oben dran. Waaaaaaahhh. Was ist das jetzt ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>gameportal</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #560000;
background-image: url(images/background.jpg);
background-repeat: repeat;
background-attachment:scroll
background-position:top;
margin: 0 auto;
text-align:center;
font-family:Arial, Verdana;
font-size: 13px;
color:white;
}

.main {
position:absolute;
left:50%;
margin-left:-480px; /* negative Hälfte von width:960px */
background-image: url(images/mainpic.jpg);
background-repeat:no-repeat;
background-attachment:scroll;
background-position:top;
height:1000px;
width:960px;
}
.mainmenu {
margin:100px auto 4px auto;
padding: 7px 10px 7px 10px;
text-align:left;
width:852px;
height:22px;
background-image:url(images/mainmenubackground.jpg);
background-repeat:no-repeat;
background-attachment:scroll;
background-position:top;
color:white;

}
.footer{
position:relative;
margin-left:-480px; /* negative Hälfte von width:960px */
left:50%;
width:960px;
border-top: 1px solid white;
}
-->
</style>
</head>

<body>
<div class="main">
<div class="mainmenu">Menupunkt 1</div>
<div>a</div>
</div>
<div class="footer">2007 by test</div>
</body>
</html>
 
Code: 
.footer{
position:absolute;
margin-left:-480px; /* negative Hälfte von width:960px */
left:50%;
top:1000px;
width:960px;
border-top: 1px solid white;
}
 
Woher soll ich denn bitte wissen, wie du dir das im Detail vorstellst. :mad:

Wenn die Box in der Höhe dehnbar sein soll, musst du dir was einfallen lassen, denn die height-Deklaration gilt in den "nicht-IE-Browsern" als feste Angabe. :p
 
Vielleicht hilft dir ja dieses Modell weiter?

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>gameportal</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #560000;
background-image: url(images/background.jpg);
background-repeat: repeat;
background-attachment:scroll
background-position:top;
margin: 0 auto;
text-align:center;
font-family:Arial, Verdana;
font-size: 13px;
color:white;
}

.main {
margin:0 auto;
background-image: url(images/mainpic.jpg);
background-repeat:no-repeat;
background-attachment:scroll;
background-position:top;
min-height:900px;
height:auto !important;
height:900px;
width:960px;
padding-top:100px;
}

.mainmenu {
margin:0 auto 4px auto;
padding: 7px 10px 7px 10px;
text-align:left;
width:852px;
height:22px;
background-image:url(images/mainmenubackground.jpg);
background-repeat:no-repeat;
background-attachment:scroll;
background-position:top;
color:white;
}

.footer{
margin:0 auto;
width:960px;
border-top: 1px solid white;
}
-->
</style>
</head>

<body>
<div class="main">
<div class="mainmenu">Menupunkt 1</div>
<div>a</div>
</div>
<div class="footer">2007 by test</div>
</body>
</html>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück