div ab einem Punkt überschreiben

Hallo zusammen,

ich habe ein kleines Problem mit meinem css der Site. Vielleicht könnt ihr mir helfen. Es gib einen header, eine Hauptnavigation darunter und abhängig vom gewählten Punkt der Hauptnavi entsprechend die Unterpunkte auf der rechten Seite.

-------------------------------------------------------|
| header |
| |
|------------------------------------------------------|
| hauptnavi |
|------------------------------------------------------|
| | untermenü |
| menü |-------------------------------------------|
| | |
|----------| content |
| |
| |
| |
| |
|------------------------------------------------------|
| footer |
|-------------------------------------------------------|


So in sieht das im Grunde aus. Nun habe ich das Problem, dass ich aus dem untermenü heraus Dateien aufrufen möchte, die sowohl das menu als auch das untermenü selbst und die hauptnavi überblenden soll, da ich den Platz zur Belegerstellung brauche.

Meine Site ist so aufgebaut, das in der index.php immer nur die entprechende Datei in den Bereich von content geholt wird.
Bei Bedarf wird dieser geteilt um untermenü darzustellen.

Wie kann ich das anstellen???

Ich verstehe nur Bahnhof. Was heißt "Dateien aufrufen"? Was heißt "Überblenden"? Genauer bitte.

der trick:

Navy = position;absolute
Dazu nen z-index

PHP-Code:

<?php
session_start();

require_once ("etc/config.php");

require_once ($root . "includes/header.php");

if ($_SESSION['id'] == "")
{
 echo "<div id='inhalt'>";
 require_once ($root . "contents/anmelden.php");
 echo "</div>";
}
else
{
 require_once ($root . "includes/navi.php");
 if ( (!isset($_GET['navi'])) &&  (!isset($_GET['menu'])) )
 {
  echo "<div id='inhalt'>";
  echo "<br>Hier kommt der Begr&uuml;&szlig;ungstext hin.";
  echo "</div>";
 }
 else
 {
  if ($_GET['navi'] == "stammdaten")
  {
   require_once ($root . "includes/smenu.php");
  }
  elseif ($_GET['navi'] != "stammdaten")
  {
   require_once ($root . "includes/gmenu.php");
  }
  if(!isset($_GET["menu"]))
  {
   echo "";
  }
  else 
  {
   require_once($root . "contents/" . $_GET['menu'] . ".php");
  }
 }
}
require_once ($root . "includes/footer.php");
?>

$_GET['menu'] ruft die entsprechenden Inhalte auf, die immer rechts vom Menü angezeigt werden. Wenn ich nun auf Neuanlage klicke, soll sich die Darstellung zwischen dem Header und dem Footer abspielen. Das heisst die drei div's müssen von einem neuen "überschrieben" werden. Mit einem Link innerhalb der dann aufgerufenen Datei möchte ich dann wieder zu dieser anzeige "zurückschalten". Jetzt klarer was ich meine ?

Jetzt klarer was ich meine ?

Nein nicht wirklich
Was ist jetzt die Frage, wie das zu positionieren ist oder wie du die Inhalte veränderst? Letzteres geht mit einem IFrame oder Ajax. Aber ich verstehe die Fragestellung noch nicht ganz.

Ich weiss nicht was ich in meiner css definieren muss, damit die betreffenden Dateien innerhalb dieser Grenzen angezeigt werden.

Hier mal die css:

@charset "utf-8";
/* CSS Document */
	body
	{
		margin: 0;
		padding: 0;
		font: 85% arial, hevetica, sans-serif;
		text-align: center;
		color: #505367;
		background-color: #dddddd;
	}
	
	#container
	{
		margin: 1em auto;
		width: 90%;
		text-align: left;
		background-color: #ffffaa;
		border: 1px solid black;
	}
	
	#logo
	{
		float: left;
		padding: 5px 0 10px 5px;
	}

	#logo img
	{
		border: none;
	}


	h1
	{
		margin-left: 400px;
		padding-left: 10%;
		font-size: 3em;
		color: #000000;
		background: #FF9933;
		margin-bottom: 20px;
		margin-top: 20px;
	}

	h1 span
	{
		background-color: #FF9933;
	}

	
	h2
	{
		margin-left: 400px;
		padding-left: 10%;
		font-size: 1.3em;
		color: #ff0000;

	}

 	h2center
	{
		font-weight: bold;
		padding-left: 20%;
		font-size: 1.3em;
		color: #ff0000;
	}



	h3
	{
		font-size: 0.7em;
		text-align: left;
		margin-left: 10px;
	}	
	
	#navi
	{
		clear: left;
		height: 21px;
		padding-left: 10px;
		font-size: 1em;
		text-align: left;
		background-color: #4A4A4A;
		padding-top: 5px;
		border-top: 1px solid #ff0000;
		border-bottom: 1px solid #ff0000;
	}

	#navi a, #navi span
	{
		font-weight: bold;
		text-decoration: none;
		color: #ffffff;
		background-color: #999999;
		margin: 5px;
		padding: 5px;
	}

	#navi a:hover
	{
		background-color: #FF0000;
		color: #000000;
	}
		
		
	#menu
	{
		list-style: none;
		padding: 20px 20px 20px 20px;
		float: left; 
		width: 130px;
		background-color: #ffffaa;
		text-align: center;
	}
	
	#menu a:link, #menu a:visited
	{
		text-decoration: none;
		color: #ffffff;
		display: block;
		margin:	5px 5px;
		padding: 5px 5px 5px 0;
		background-color: #999999;
		border: 1px solid #ff0000;
		/* die Höhenangabe ist für den IE, damit die gesamte FLäche des Links klickbar ist */
		height: 1em;
	}
	
	#menu a:hover
	{
		background-color: #FF0000;
		color: #000000;
	}
	
	
	#inhalt	
	{
		margin-top: 20px;
		margin-left: 180px;
		margin-right: 20px;
		margin-bottom: 20px;
		height: auto;
		background-color: #ffffaa;
		border: 1px solid #ff0000;
	}
	
	#inhalt fehler
	{
		margin-left: 100px;
		color: #FF0000;
		font-size: 1.5em;
		font-weight: bold;
	}
	
	#content fehler
	{
		margin-left: 100px;
		color: #FF0000;
		font-size: 1.5em;
		font-weight: bold;
	}


	#inhaltgeteilt fehler
	{
		margin-left: 100px;
		color: #FF0000;
		font-size: 1.5em;
		font-weight: bold;
	}
	
		
	#footer
	{
		clear: left;
		background-color: #4A4A4A;
		color: white;
		font-size: 1.1em;
		text-align: center;
		padding: 5px;
		border-top: 1px solid #FF0000;
	}
	
	
	
	
	
	
	#inhaltgeteilt	
	{
		margin-top: 20px;
		margin-left: 180px;
		margin-right: 20px;
		margin-bottom: 20px;
		height: auto;
		background-color: #ffffaa;
		border: 1px solid #ff0000;
	}
	
	
	#linkbar
	{
		height: 21px;
		padding-left: 10px;
		font-size: 1em;
		text-align: left;
		background-color: #4A4A4A;
		padding-top: 5px;
		border-top: 1px solid #ff0000;
		border-bottom: 1px solid #ff0000;
	}

	#linkbar a, #linkbar span
	{
		font-weight: bold;
		text-decoration: none;
		color: #ffffff;
		background-color: #999999;
		margin: 5px;
		padding: 5px;
	}

	#linkbar a:hover
	{
		background-color: #FF0000;
		color: #000000;
	}
		
	#content
	{
	 	margin-top: 20px;
		margin-left: 20px;
		margin-right: 20px;
		margin-bottom: 20px;
		
		height: auto;
		background-color: #ffffaa;
		border: 1px solid #ff0000;
	}
	
	#content schrift
		{
			font-size: 0.8em;
		}
	
	#kunden
	{
		height: 150px;
		overflow: auto;
		padding-left: 10px;
		font-size: 0.8em;
		text-align: left;
		background-color: #ffffaa;
		padding-top: 5px;
		border-top: 1px solid #ff0000;
		border-bottom: 1px solid #ff0000;
	}

Wie wärs wenn du mal das Problem vernünftig schilderst, statt mit kiloweise CSS um dich zu werfen?

Position: relative müßte dir weiterhelfen, wie dani_o es schon gesagt hat.

Meiner Meinung nach war das vernünftig geschildert. Mal vom ersten Post abgesehen. Ein Screenshot, das man weiss wie sie Site aussieht und das css dazu, wie das Aussehen zustande kommt. Dazu noch die Frage, wie ich hinkriege, das der gewünschte Effekt eintritt. Was war daran falsch??? Sonst wieder immer direkt gemeckert, das man den Code posten soll !!!

Original geschrieben von fritzje610
Meiner Meinung nach war das vernünftig geschildert. Mal vom ersten Post abgesehen. Ein Screenshot, das man weiss wie sie Site aussieht und das css dazu, wie das Aussehen zustande kommt. Dazu noch die Frage, wie ich hinkriege, das der gewünschte Effekt eintritt. Was war daran falsch??? Sonst wieder immer direkt gemeckert, das man den Code posten soll !!!

also wenn ich ehrlich bin, verstehe ich auch nur bahnhof. kannst du mal in deinem screenshot GENAU markieren, wo das problem liegt. und das dann GENAU schildern?

gruß
peter

Vielleicht solltest du den ganzens Scheiß erstmal lernen, bevor du "Webdesing" verkaufen willst, aber selbst simpelste Techniken nicht beherrschst!

Das angehängte Bild zeigt den weißen (naja, zartrosa) Bereich in dem die gewünschte Darstellung erfolgen soll.

Nutzen will ich diesen Bereich, wenn man z.B. auf Neuanlage klickt. (siehe erstes gepostetes Bild)

Hat sich erledigt. Hab das css um dies erweiter:

#blende
	{
		position: relative; right: 181px; top:-21px;
		width: 100%;
	}

und die Dateien die darin angezeigt werden sollen entsprechend angepasst.


Trotzdem dank an euch, dass ihr versucht habr mir zu helfen.