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

Höhe ändert sich obwohl fest definiert

D

Don Carlos

New member
Moin,

ich muss direkt vorneweg sagen, dass mir DIV-Container erst jetzt so langsam vertraut werden.

Ich hab ein komisches Problem. Folgendes:

Ein zentrierter DIV-Bereich beinhaltet alles weitere. Dieser Bereich hat auch ein Hintergrundbild.

Code: 
	#container
	{
		
		position: absolute;
		top:50%;
		left:50%;
		margin: -300px 0 0 -400px;
		width: 800px;
		height: 600px;
		text-align: center;
		background-color: #3B5899;
		background-image: url(bgtest.jpg);
		background-repeat: no-repeat;
		background-position: 0 0;
		border: 2px solid #000000;
		overflow:hidden;
	}

Mit "height: 600px;" sollte es ja eigentlich keine Diskussion über die fixe Höhe geben... eigentlich.

Das HTML-Gerüst sieht ungefähr so aus:

HTML: 
<div id="container">[B]x[/B]
<div id="menu">
</div>
<div id="content">
</div>
</div>

Wenn ich an der markierten Stelle (x) einen Text einfüge (will da noch eine Art Überschrift platzieren), ändert sich die Höhe von #container - zumindest im IE 7.

1. Warum ist das so?
2. Was tun?

VG,
Don Carlos
 
Don Carlos schrieb:
Wenn ich an der markierten Stelle (x) einen Text einfüge (will da noch eine Art Überschrift platzieren), ändert sich die Höhe von #container - zumindest im IE 7.

1. Warum ist das so?
2. Was tun?
Zum Vergrößern anklicken....

Kann ich nicht nachvollziehen. Die Container-Höhe ist trotz Text im IE7 bei mir identisch mit FF. Hast du ne Beispielseite live?
 
Hallo Anna,

nein, ich habe noch nichts online.
Ich bastel seit längerem an einem Layout für meine Bewerbungs-Homepage und experimentiere die ganze Zeit lokal.
Mit Layout & Design stehe ich seit eh und je auf Kriegsfuß...

Die Inhalte sind da, aber die Verpackung...

Ich habe mal ein Beispiel gebastelt:

HTML: 
<html>
<head>
<style type="text/css">
	body
	{

		margin: 0;
		padding: 0;
		text-align: center;
		background-color: #F7F7F7;
	}
	
	
	#container
	{
		
		position: absolute;
		top:50%;
		left:50%;
		margin: -300px 0 0 -400px;
		width: 800px;
		height: 600px;
		text-align: center;
		background-color: #3B5899;
		background-image: url(bgtest.jpg);
		background-repeat: no-repeat;
		background-position: 0 0;
		border: 2px solid #000000;
		overflow:hidden;
	}
	
		#mainmenu
	{	position: relative;
		padding: 0px;
		top:40px;
		left:0px;
		width: 100%;
		height: 32px;
		background-color: #6D84B4;
		color: #FFFFFF;
		overflow:hidden;
		text-align:left;

	}
	
</style></head> 
</head>
<body>
<div id="container">
bla
	<div id="mainmenu"></div>
</div>
</body>
</html>

Hier ist es ähnlich wie bei dem was ich grade vor habe.
Der mainmenu-Container hat beim vorgegebenen Quellcode schon nicht mehr die gewünschte Position, weil ich im "#Container"-DIV ein "bla" ergänzt habe...

Aber während ich das hier so schreibe habe ich schon einen Verdacht.
Könnte mit position:relative zusammenhängen, oder?
 
Habe Dein Beispiel mal geringfügig verändert
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>
<style type="text/css">
	body {
		margin: 0;
		padding: 0;
		text-align: center;
		background-color: #F7F7F7;
	}

	#container {
		position: absolute;
		top:50%;
		left:50%;
		margin: -200px 0 0 -400px;
		width: 800px;
		height: 400px;
		text-align: center;
		background-color: #3B5899;
		background-image: url(bgtest.jpg);
		background-repeat: no-repeat;
		background-position: 0 0;
		border: 2px solid #000000;
		overflow:hidden;
	}

	#mainmenu {
		position: absolute;
		padding: 0px;
		top:15%;
		left:0px;
		width: 100%;
		height: 32px;
		background-color: #6D84B4;
		color: #FFFFFF;
		overflow:hidden;
		text-align:left;
	}
</style>
</head>
<body>
<div id="container">
ganz viel Text hier<br />ganz viel Text hier<br />    ganz viel Text hier<br />    ganz viel Text hier<br />
	<div id="mainmenu">hier menü</div>
</div>
</body>
</html>
 
Ups!
ich konnte meinen überflüssigen Beitrag gerade leider nicht mehr löschen!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Das wäre mal ein vorschlag an die Forum-Autoren.
 
Zuletzt bearbeitet:
sumatra70 schrieb:
Ups!
ich konnte meinen überflüssigen Beitrag gerade leider nicht mehr löschen!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Das wäre mal ein vorschlag an die Forum-Autoren.
Zum Vergrößern anklicken....

Versuche Dir mal vorzustellen, welches Chaos hier herrschen würde, wenn jeder so "dirnichtsmirnichts" irgendwelche Beiträge löschen dürfte.
Dazu sind wir hier...
 
Wenn jeder die Nachrichten löschen könnte, das wäre dann ja wirklich ein wenig leichtsinnig. Ich meinte damit eigendlich, das nur der Schreiber der gesendeten Nachricht das Recht haben könnte sie wieder löschen zu dürfen. Bei anderen Foren funktioniert das einwandfrei ohne Caos.
 
sumatra70 schrieb:
Bei anderen Foren funktioniert das einwandfrei ohne Caos.
Zum Vergrößern anklicken....

[OT]Du kannst ruhig beim Deutschen bleiben: Caos ist italienisch. ;) [/OT]

Deine Beiträge kannst Du doch jederzeit editieren. Diese Möglichkeit nutze ich, wenn ich merke, dass ich Unsinn geschrieben oder etwas vergessen habe.

Edit: Ist eben passiert: hatte zweimal hintereinander "ich" geschrieben.
 
Zuletzt bearbeitet:
anna55 schrieb:
[OT]Du kannst ruhig beim Deutschen bleiben: Caos ist italienisch. ;) [/OT]
Zum Vergrößern anklicken....

Da hätte ich noch mal editieren müssen. --> Kleiner Fehler

Deine Beiträge kannst Du doch jederzeit editieren. Diese Möglichkeit nutze ich, wenn ich merke, dass ich Unsinn geschrieben oder etwas vergessen habe.

Edit: Ist eben passiert: hatte zweimal hintereinander "ich" geschrieben.
Zum Vergrößern anklicken....

Wenn sich mein Beitrag im nachhinein schon erledigt hatte, was ich leider erst hinterher festgestellt habe, was sollte ich denn sonst schreiben? "Hallo, schönes Wetter"?

Man muß ja aber noch sagen, solch eine Löschung kommt ja eigendlich auch nur selten vor.
 
Hallo Anna,

ich Danke Dir vielmals!
Es war doch wie von mir vermutet. Es lag am "position:relative;".
Hatte da was durcheinander gebracht, bzw. mir waren die Effekte der veschiedenen Values nicht bewusst.

Für mich war "absolute" = "fixed"... egal. Es war ein Verständnisproblem meinerseits (von wem auch sonst).

Vielen Dank!
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben