Zur Navigation

problem mit tabelle

1 mamaplatzda

Hallo leute,
ich habe seit längerer zeit ein problem mit einer seite und finde derzeitig noch keine lösung dafür, habt ihr vielleicht einen tipp?

Die Seite ist folgendermaßen aufgebaut:

<!--Start Frame -->
<div id="Frame">
<!--Start Navleft -->
< div id="Navigation">
</div>
<!--Ende Navleft -->
<!--Start Inhalt-->
<div id="Inhalt" name="Inhalt">
<!--Start Info-->
<div id="Info">
</div>
<!--Ende Info-->
</div>
<!--Ende Inhalt-->
</div>
<!--Ende Frame -->

Der Inhalt für div=“Inhalt“ kommt aus einer datenbank
Kommt nun sehr viel Inhalt aus der datenbank wird als erstes die tabelle mit dem inhalt aufgebaut und danach wird erst das div=“frame“ mit der farbe grau gefüllt. Dies ist notwendig um die navigationsleiste div=Navleft nach unten hin mit grau aufzufüllen um ein designbruch zu vermeiden.
Ich hätte jetzt gerne, dass erst der frame mit grau gefüllt wird und dann der inhalt und die tabelle in div=“Inhalt“ geschrieben wird.

Ich habe zum besseren verständnis die screen-shots hier gepostet


http://fotos.web.de/mkaweb/problemmittabelle

vielen dank im voraus
gruß
mamaplatzda

fotos.web.de/mkaweb/problemmittabelle

04.01.2007 13:54

2 Jörg Kruse

Hallo mamaplatzda,

Die Höhe von Frame richtet sich wohl nach der des Inhalts aus, von daher verständlich, dass der Browser diese Reihenfolge wählt.

Vielleicht könnte man den grauen Hintergrund aber auch dem Inhalts-Div zuordnen, inklusive eines Innenabstandes, über welchen man dann absolut die Navigation positioniert. Wie sieht denn das aktuelle CSS aus?

04.01.2007 14:12

3 mamaplatzda

hallo jörg,
danke für die schnelle antwort
mein css sieht so aus


/*------------------------Start Info------------------------*/

div#Info
{
	font-size: 8pt;
	float: right;
	width: 110px;
    margin: 0 0 0 ;
    background-color: #fff;
    min-height: 340px;
    text-align:justify;
}

/*------------------------Ende Info-------------------------*/



/*------------------------Start Body------------------------*/


body {
margin:0 auto; 
text-align:center; 
margin: 0;
padding: 0.3em ;
text-align: center;  
font-size: 8pt;
font-family: Arial,sans-serif,Helvetica;
color:#000;
background-color: #fff;
}

html>body div#Seite
{
    border-color: gray; 
}

/*------------------------Ende Body-------------------------*/


/*------------------------Start Seite-----------------------*/

div#Seite
{
    text-align: left;    
    margin: 0 auto;     
    width: 980px;
    padding: 0;
    background-color: #eee;
	color: #000;

}

/*------------------------Ende Seite------------------------*/



/*------------------------Start HptNavigation---------------*/

div#Navigation
{
    font-size: 8pt;
    float: left;
    width: 110px;
    background-color:#eee;
	margin: 0 0 0em;
    padding: 0;
    color:#006699;
    text-align:center;
    min-height: 351px;
}



/*------------------------Ende HptNavigation----------------*/

/*------------------------Start Inhalt----------------------*/

div#Inhalt
{
	float: right;
	width: 860px;
    margin: 0 0 0.1em;
    padding: 0 em;
    background-color: #fff;
    min-height: 350px;
}
* html div#Inhalt
{
    height: 1em;  I
    margin-bottom: 0;
}

div#Inhalt a
{
      color: #ff6600;
      text-decoration: none;
}



/*------------------------Ende Inhalt-----------------------*/

/*------------------------Start Frame----------------------*/

#Frame
{
background-color:#eee !important;
color:black;
text-align: left;
}

/*------------------------Ende Frame-----------------------*/

[Edit Jörg: zur besseren Lesbarkeit Code in Codeblock eingefügt]

04.01.2007 14:30 | geändert von Jörg: 04.01.2007 14:56

4 Jörg Kruse

Wenn ich dieses CSS mit dem von dir angeführten Ausschnitt des HTML-Quelltextes verwende, wird der Navigationsbereich bei längerem Inhalt nicht mit ausgedehnt (getestet mit Opera 9, Firefox 2 und Internet Explorer 6 +7). Was ist mit dem div#Seite - spielt dies dabei vielleicht noch eine Rolle? Eventuell mal den gesamten HTML-Code posten

04.01.2007 15:02

5 mamaplatzda

ich hatte dir nur auszüge gepostet, hierd der fast originale quelltext.gruß

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href=styles/style.css>
</head>
<body>
<script type="text/javascript" src="styles/script.js"></script>
<!--Start Seite-->
<div id="Seite">
	<!--Start Kopfzeile-->
	<div id="Kopfzeile" name="Kopfzeile">
			</div>	
	<!--Ende Kopfzeile-->
<!--Start Frame -->
<div id="Frame">
	<!--Start Navleft -->
	<ul id="Navigation" name="Navigation"><a href="start.htm">Startseite<img border="0" src="images/arrow.gif" width="15" height="9"></a>
	</ul>
	<!--Ende Navleft -->
	<!--Start Inhalt-->
	<div id="Inhalt" name="Inhalt">
		<!--Start Info-->
		<div id="Info" name="Info">
		</div>
		<!--Ende Info-->
		
	</div>
	<!--Ende Inhalt-->		
</div>
<!--Ende Frame -->
	<!--Start Fusszeile-->
	<div id="Fusszeile" name="Fusszeile">
		<a href="start.htm"><img border="0" src="images/arrow.gif" width="15" height="9">Startseite</a>
		<a href="contact.htm"><img border="0" src="images/arrow.gif" width="15" height="9">Kontakt</a>
		<a href="sitemap.htm"><img border="0" src="images/arrow.gif" width="15" height="9">Sitemap</a>
		<a href="imprint.htm"><img border="0" src="images/arrow.gif" width="15" height="9">Impressum</a>
	</div>
	<!--Ende Fusszeile-->
	
</div>
<!--Ende Seite-->

</body>
</html>

04.01.2007 15:53

6 Jörg Kruse

Ok, im Internet Explorer wird der graue Hintergrund nun bis ans Ende des Inhaltes gezogen - ich kann hierbei allerdings keine Verzögerung entdecken. Und in Opera und Firefox ist der Hintergrund nur so hoch wie der Inhalt der Navigation. Falls die bei dir nicht der Fall sein sollte: befindet sich in der Datei script.js noch ein Script, welches den Style irgendwie beeinflusst? 

<script type="text/javascript" src="styles/script.js"></script>

04.01.2007 16:34

7 mamaplatzda

nein, das script hat damit nichts zu tun.
der fehler tritt nur auf wenn in div="Inhalt" sehr viel an daten geladen wird

04.01.2007 17:54

8 Jörg Kruse

nein, das script hat damit nichts zu tun.

Naja, wäre halt noch eine Möglichkeit gewesen, zumal die Datei im Ordner /styles liegt und gerade Scripte, die Styles nachträglich verändern, dies mit sichtbarer Verzögerung tun können.

der fehler tritt nur auf wenn in div="Inhalt" sehr viel an daten geladen wird

Ich habe das div soweit mit Text gefüllt, dass es seitlich einen vertikalen Scrollbalken über zwei Seitenlängen gibt. Den von dir beschriebenen Effekt konnte ich dabei nicht beobachten (nur, wie gesagt, dass in einigen Browsern der Hintergrund gar nicht ausgedehnt wird)

04.01.2007 18:07

9 mamaplatzda

hallö
ich habe das problem in acht foren gepostet und keiner hat dafür eine lösung gefunden...also keine die das problem "wirklich" löst.
wenn ich in div=seite eine grafik einbinde funktioniert es insofern, daß der ie7 die ellenlange tabelle und die kaskadierende grafik gleichzeitig anzeigt...aber eben nur im ie7
ellenlang bedeutet: tabelle die über 50 und mehr dina4 seiten gehen würde

05.01.2007 13:47

10 mamaplatzda

hallö
ich habe das problem in acht foren gepostet und keiner hat dafür eine lösung gefunden...also keine die das problem "wirklich" löst.
wenn ich in div=seite eine grafik einbinde funktioniert es insofern, daß der ie7 die ellenlange tabelle und die kaskadierende grafik gleichzeitig anzeigt...aber eben nur im ie7
ellenlang bedeutet: tabelle die über 50 und mehr dina4 seiten gehen würde

05.01.2007 13:48