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

maximale Höhe

Status
Für weitere Antworten geschlossen.
D

Daraace

Neues Mitglied
Guten Tag,

Wie kann ich einen div-container so einstellen, dass er immer (egal bei welcher Auflösung) mit dem Ende der Seite abschließt aber falls mehr Text ist, als hinein passt, der container sich vergrößert (also die komplette Seite gescrollt werden muss). Es muss in IE und Firefox funktionieren.
Falls es mit div nicht funktioniert wäre ich auch über einen Vorschlag mit Tabellen oder anderem froh.

lg
​
 

Anhänge

  • screen.JPG
    screen.JPG
    24,1 KB · Aufrufe: 10
Benutz einfach "heiht: 100%". Musst dem Container dann aber sagen, dass er erst ab nem bestimmten Wert oben anfangen soll. Das machst du z.B. mit "margin-top: X px".
 
Ich habe vergessen zu erwähnen, dass über dem container noch Banner und Menü sind (sieht man in der beigefügten Grafik). Also wenn ich die Höhe auf 100% stelle ist der Container so groß wie die gesamte Seite, d.h. muss man scrollen auch wenn kein text bis nach unten reicht. Ich könnte nun die Höhe auf 60-70% stellen (100% minus den % die Banner und Menü einnehmen) jedoch ändert sich das mit der Auflösung.

@snoopy:
Ich weiß nicht ob dir das klar war und die Lösung für das Problem die margin-top-veränderung ist, falls es so ist erkläre mir das bitte genauer. Ich hab ein bisschen rumprobiert verstehe aber nicht wie das gehen soll.

lg
 
die einfachste Lösung wäre den Eindruck der Content-Box zu erzeugen durch darstellen eines Hintergrundbildes, dieses einfach mit y-Repeat wiederholen lassen, dann ist es automatisch bis an den unteren Seitenrand.

Dann brauchst du dich nurnoch darum kümmern dass deine Schrift nicht links und rechts "überfließt"
 
Hab jetzt versucht es anders zu lösen und zwar hab ich einen container um alles herum gelegt, ihn auf heigth:100%; gestellt und ihm die gleiche bg-farbe wie dem inhaltscontainer gegeben. Jetzt hab ich ein neues Problem :-(

heigth:100%; funktioniert nicht, weder im Firefox noch im IE (ohne DTD gehts im FF, aber dann verändern sich die Buttons im IE)

Ich poste mal den Code


CSS:

body {
background-image:url(stylepics/green.bmp);
padding:0px;
margin:0px;
border:0px;
}
#block {
padding:0px;
margin:0px;
border:0px;
width:764px;
background-image:url(stylepics/yellow.bmp);
position:relative;
height:100%;
}
#menu {
padding:0px;
margin:0px;
border:0px;
width:764px;
height:70px;
background-image:url(stylepics/green.bmp);
}

a.butt {
width:119px;
height:35px;
padding-top:15px;
margin-bottom:10px;
margin-top:10px;
margin-right:10px;
background-image:url(stylepics/yellow.bmp);
display:block;
text-decoration:none;
font-family:arial;
color:#660000;
float:left;
}
a.buttr {
width:119px;
height:35px;
padding-top:15px;
margin-bottom:10px;
margin-top:10px;
background-image:url(stylepics/yellow.bmp);
display:block;
text-decoration:none;
font-family:arial;
color:#660000;
float:left;
}
a.butt:hover, a.butt:active, a.buttr:hover, a.buttr:active
{
background-image:url(stylepics/green.bmp);
}

img.logo {
height:100px;
position:fixed;
left:17px;
bottom:10px;
}
#haupt { padding:0px;
margin:0px;
border:0px;
width:764px;
text-align:left; }

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<img src="stylepics/logo.bmp" class="logo">
<center><div id="block">
<center><img src="stylepics/ueber.bmp" style="margin:0px; padding:0px; border:0px;"></center>
<div id="menu">
<a class="butt" href="#">menu1</a>
<a class="butt" href="#">menu1</a>
<a class="butt" href="#">menu1</a>
<a class="butt" href="#">menu1</a>
<a class="butt" href="#">menu1</a>
<a class="buttr" href="#">menu1</a>
</div>
<div id="haupt">
test<br>
test<br>
test<br>
test<br>
test<br>
</div>
</div></center>
</body>
</html>
 
Nix Titel

@Daraace

also, mach mal ne Zeichnung, einen Entwurf, wie die Seiten aussehen sollen, von mir aus so:
______________________________
|............... Banner ..........................|
|.................................................... |
-----------------------------------------
|............. Navigtion........................ |
|.....................................................|
-----------------------------------------
| ....................................................|
| ....................................................|
|................. Main............................|
| ....................................................|
-----------------------------------------
|.............. Fußzeile(n).................... |
-----------------------------------------


Is nicht voll sexy, aber die Teile da sind die Boxen, also die div-"Geräte", die ja positioniert werden wollen. Jetzt sag wie groß die seien sollen in Prozent. Die ganze Seite hat 100% Höhe und 100% Breite , die "Main" genannte braucht ne Mindesthöhe in %, die hat sie auch, wenn nix drin steht. Dann ist noch wichtig zu wissen, bei welchen Boxen die Höhe nicht fest ist, weil sie ev. mit sich ändernden Inhalten gefüllt wird. Wenn keine Boxen nebeneinander liegen sollte jede Box 100% breit sein.

Wenn Du Dir das überlegt hast und hier postest, mach ich den Rest und poste ihn auch hier. Dauert aber ev. 2 oder sogar 4 Tage, habe halt zu tun.
Jetzt klatsch aber nicht 10 Boxen parallel neben einander, denn wir wollen ja keine Witze machen, sondern ein simples Beispiel-Design klarmachen.
Oki Doki.
Bis denn
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben