• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Grössenproblem zweier Divs

B

BigSanch

New member
Hi



Ich habe schon einiges gelesen und gefunden, zu dem Problem, aber die Lösungen oder Vorschläge beziehen sich auf nebeneinander liegende Div's und ähnliches, was ich versucht habe um zu setzen, aber nicht gefuntzt hat.



Folgendes Problem:



Ich habe ein Div (home), welches das Hintergrundbild der Seite zeigt:

Code: 
 #home   { position:absolute; width:100%; height:100%-180px; top:180px; z-index:4; min-height:610px; min-width:956px; }

In diesem Div, wird eine Seite geladen, welche mit Tabelle das gesamte Bild aufgeteilt, je nach Auflösung, die Tabelle vergrössert oder verkleinert, bis auf min-hight/wide, somit ist das Bild so gross wie das Fenster



Ich habe ein zweites Div (page), welches über dem #home liegt und den gesamten Text enthält:

Code: 
 #page   { position:relative; width:95%; height:95%-210px; top:210px; z-index:900; overflow:auto; }

In diesem Div werden (über das Menü) die Seiten inhalte geladen.



Wenn ich nun aber einen Text habe, der sehr lange ist, wird das Div #page dementsprechend hoch. Das Div #home aber bleibt bei der Grösse des Fensters.



Wie kann ich es erreichen, dass sich das #home Div, der Grösse des #page Div's anpasst?



MfG und Danke für die Antworten
 
Gib mal Deinem Div #home noch ein
PHP: 
overflow:hidden;
und dem Div #page einen Abstand nach unten, damit der gesamte Inhalt sichtbar ist
PHP: 
margin-bottom:210px;

Edit: Deine height-Eigenschaften haben zu viele Werte, schreib entweder eine Längen- oder eine Prozentangabe. CSS lässt sich hier überprüfen:
http://jigsaw.w3.org/css-validator/#validate-by-input
 
Zuletzt bearbeitet:
Hi

Danke Anna für deine Antwort, aber ich weiss nicht genau, ob ich es richtig erklärt habe, aber deine Lösung bringt mich nicht weiter, denn folgender Massen:

Gib mal Deinem Div #home noch ein overflow:hidden;
Zum Vergrößern anklicken....

Genau das ist das Problem, dieses Div will ich dynamisch vergrössern lassen zum andren Div. Das andre Div ist di Grössenvorgabe.

und dem Div #page einen Abstand nach unten, damit der gesamte Inhalt sichtbar ist margin-bottom:210px;
Zum Vergrößern anklicken....

Brauch ich nicht, da ich die Höhen Angabe mit 95% "- dem Abstand den ich per 'top' nach unten setze " schon sage, dass er um das versetzte auch vergrössern soll, was auch gut funtzt, denn jeglicher Text, egal wie gross wird komplett angezeigt, nur das #home Div sollte sich diesem anpassen

Ausser ich hab nun was net gechecked, glaub ich so nicht weiter zu kommen

Ich hab durch googlen einen Ansatz gefunden, wo ich per Java die Grösse einis Divs auslesen kann, was ich auch schon wusste, aber wenn ich das anwende, verändert sich das komplette Verhalten, der andren Divs, die auf der Seite sind
 
BigSanch schrieb:
..aber ich weiss nicht genau, ob ich es richtig erklärt habe..
Zum Vergrößern anklicken....

Du hast Dein Anliegen schon richtig erklärt. Mein Ansatz war dieser hier:
PHP: 
<!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" xml:lang="de" lang="de">
<head>
<title>Höhe</title>
<style type="text/css">
#home {
	position:absolute;
	width:100%;
	height:100%-180px;
	top:180px;
	z-index:4;
	min-height:610px;
	min-width:956px;
	overflow:hidden;
	background:black;
}
#page {
	position:relative;
	width:95%;
	height:95%;
	top:210px;
	z-index:900;
	overflow:auto;
	margin-bottom:210px;
	background:green;
}
</style>
</head>
<body>
<div id="home">
	<div id="page">Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der Pagetext<br />
	Hier der Pagetext<br />Hier der Pagetext<br />Hier der untere Pagetext<br />
	</div>
</div>
</body>
</html>

Ich habe die Hintergrundfarben der besseren Übersichtlichkeit halber eingebaut. Durch overflow:hidden für den Div home passt sich dieser der variablen Höhe des Divs page an. Wenn Du nun die margin-Angabe weglässt, dann fehlt durch Deine - nicht validen - doppelten width-Werte der von mir im Beispiel als unterer Pagetext bezeichnete Text.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben