SebiPuck
Erfahrenes Mitglied
Hallo, ich habe ein kleines Problem.
Leider schaffe ich es nicht mit height: auto; oder height: 100%;
meinen Container, welcher als Hintergrund für die Website erstellt wurde in die gewünschte Höhe zu bekommen.
Er ist zwar so groß wie der größte Teil der page,
jedoch habe ich an der page noch einen div (features) angehängt,
welcher dann nicht mehr von dem Hintergrund Container (site-bg) miteinbezogen ist.
Hier ein Screenshot von dem Problem:

Hier der Code:
HTML:
INFO:
Ich will nicht "body" als background verwenden !
Bitte helft mir so schnell es geht, ist ziemlich dringend,
Vielen Dank im Voraus,
LG
#Edit:
habe den Fehler gefunden.
#wrap ist der container, in welchem alle anderen betroffenen sind, der stand auf 100%, musste auf auto gestellt werden, geht nun wunderbar ^^
Leider schaffe ich es nicht mit height: auto; oder height: 100%;
meinen Container, welcher als Hintergrund für die Website erstellt wurde in die gewünschte Höhe zu bekommen.
Er ist zwar so groß wie der größte Teil der page,
jedoch habe ich an der page noch einen div (features) angehängt,
welcher dann nicht mehr von dem Hintergrund Container (site-bg) miteinbezogen ist.
Hier ein Screenshot von dem Problem:

Hier der Code:
PHP:
#wrap{
width: 971px;
height: 100%;
margin: auto;
-webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 1);
-moz-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 1);
box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 1);
}
#page{
width: 950px;
min-height: 400px;
background: #fff;
/* TOP RIGHT BOTTOM LEFT -> begin with top, continue in clockwise*/
padding: 10px 10px 10px 10px;
}
#site-left{
width: 600px;
padding: 20px;
border: 1px solid #E8E8E8;
background: url(images/content-bg.png) #fff repeat;
}
.article{
width: 550px;
margin-bottom: 35px;
}
.article h2{
font-family: 'MinecraftRegular';
font-size: 21px;
color: #27123f;
background: url(images/article-seperator.png) left bottom repeat-x;
padding: 0px 0px 12px 10px ;
display: block;
margin-bottom: 15px;
}
.article-text{
width: 530px;
}
#features{
width: 950px;
height: 500px;
background: #fff;
/* TOP RIGHT BOTTOM LEFT -> begin with top, continue in clockwise*/
padding: 10px 10px 10px 10px;
}
HTML:
HTML:
<div id="site-bg">
<div id="wrap">
<div id="page">
<div id="site-left">
<div class="article">
<h2>Server ist online !</h2>
<div class="article-text">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam
et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
</p>
</div>
</div>
<div class="article">
<h2>Changelog ist vorhanden !</h2>
<div class="article-text">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam
et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
</p>
</div>
</div>
<div class="article">
<h2>Shops sind offen !</h2>
<div class="article-text">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam
et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet.
</p>
</div>
</div>
</div>
</div>
<div id="features">
<h1>lalalalal</h1>
</div>
</div>
</div>
INFO:
Ich will nicht "body" als background verwenden !
Bitte helft mir so schnell es geht, ist ziemlich dringend,
Vielen Dank im Voraus,
LG
#Edit:
habe den Fehler gefunden.
#wrap ist der container, in welchem alle anderen betroffenen sind, der stand auf 100%, musste auf auto gestellt werden, geht nun wunderbar ^^
Zuletzt bearbeitet: