Hallo Zusammen
Problem gelöst: Der Fehler war in der navigation!
Ich entwickle momentan eine Webseite für Joomla 1.5.X. Meine Webseite ist 100% Breit, darin befindet sich ein DIV mit einer festen Breite, der zentriert ist.. Dabei habe ich folgendes Problem: Wenn das Fenster maximiert ist, ist die Breite des html Tags 100% und der zweite DIV wird auch korrekt angezeigt. Sobald man aber das Fenster verkleinert auf zum Beispiel die grösse des festen Div's, wird zwar die Webseite korrekt dargestellt, aber es hat unten eine Scrollbar. Schiebt man diese nach rechts, so sieht man wie die Seite irgendwann endet und dann einfach Weiss kommt (Siehe Bild). Mit dem Debugger habe ich herausgefunden, dass der Fehler schon beim HTML Tag liegt.
Frage: Wie kann ich diesen Fehler beheben?
Bild (Size: 535 X 708px): Blau Markierte ist der HTML Tag. Man sieht schön, wie er plötzlich endet.
[Blockierte Grafik: http://img513.imageshack.us/img513/5325/8178792felhlerhtml.png]
HTML & PHP Code:
PHP
<?php defined( '_JEXEC' ) or die( 'Restricted access' ); ?><!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=”<?php echo $this->language; ?>”lang=”<?php echo $this->language; ?>” ><head> <jdoc:include type="head" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/webseite/style.css" type="text/css" /> <!--[if IE]><link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/webseite/ie.css" type="text/css" /> <![endif]--></head><body><div id="blabla"><div id="logo"><h1>Webdsign mit Stil</h1></div> <!-- Logo ende--> <div id="navigation" > <jdoc:include type="modules" name="user3" /> </div> <!-- Navigation ende--> <div id="bild_all"><jdoc:include type="modules" name="bild" /><!--<div id="offerte_button"><jdoc:include type="modules" name="offertbutt" /></div>--></div> <!-- Bild_Tan ende--></div><div id="line"></div><div id="wrapper"><div id="col"><div id="text"><jdoc:include type="component" /></div><!--Text ende--><div id="fusszeile"><jdoc:include type="modules" name="footer" /></div> <!-- Fusszeile ende--></div><!--Wrapper ende--></div></body></html>CSS Code:
Code
/****** CSS Webseite ******//******© Nicole Fink, 2011 - V. 1.0 ******/body { /* Background:url(images/background.jpg);*/ background-color: #f5f5f5; background-color: rgb(245, 245, 245); /* The Fallback */ /* Hintergrundfarbe */ background: rgb(245, 245, 245); color: white; /* Schriftfarbe */ background-repeat:repeat-x; margin: 0 auto;}#wrapper{ text-align:center; width:100%; height: 100%;/*automatische Hoehe*/ margin:0 auto;/*positioniert den wrapper in der Mitte des Browserfensters*/ /*background-color:#f5f5f5;*/ background-color: #add2e6; background:rgb(173, 210 230);}#blabla{ text-align:center; width:935px; height: auto;/*automatische Hoehe*/ margin:0 auto;/*positioniert den wrapper in der Mitte des Browserfensters*/ /*background-color:#f5f5f5;*/ background-color: #f5f5f5; background: rgb(245, 245, 245); background-color: rgb(245, 245, 245); }#col{ width:100%; height:auto; margin:0; background-color: #add2e6; background-color:rgb(173, 210 230); background:rgb(173, 210 230); }#line{ background-image:url(images/strike.jpg); background-repeat:repeat-x; height:8px; width:100%;}#logo{ position:relative; background:url(images/logo.png); width: 935px; height: 150px; background-repeat:no-repeat; margin-top:35px; margin-left: -20px; text-align:left; }#logo h1 { color: #2796d6; text-transform: uppercase; font-family: "Adobe Caslon Pro", "Hoefler Text", Georgia, Garamond, Times, serif; letter-spacing:0.1em; text-transform: lowercase; font-size: 28px; font-variant: small-caps; font-style:italic; padding-top: 90px; padding-left:30px; letter-spacing: 3px; }#navigation{ position:relative; width: 935px; height: 41px; margin-left:480px; font-size: 21px; text-align: center; font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; letter-spacing: 2px; color: #7d8692; }/******** LINK Definition NAVIGATION********/#navigation a:link{color: #706f6a;text-decoration: none;}#navigation a:visited{color: #706f6a;text-decoration: none;}#navigation a:hover{color: #2796d6;text-decoration: none;} /*** Bilder Header ***/ #bild_tan{ position: relative; background: url(images/bild_tan2.jpg); width: 935px; height: 311px; margin-top: 0px; } #bild_help{ position: relative; background: url(images/bild_help.jpg); width: 934px; height: 315px; margin-top: 0px; } #bild_nini{ position: relative; background: url(images/bild_nini.jpg); width: 936px; height: 318px; margin-top: 0px; } #bild_zeit{ position: relative; background: url(images/bild_zeit.jpg); width: 936px; height: 315px; margin-top: 0px; } #bild_preis{ position: relative; background: url(images/bild_preis.jpg); width: 924px; height: 312px; margin-top: 0px; } #bild_kontakt{ position: relative; background: url(images/bild_kontakt.jpg); width: 924px; height: 314px; margin-top: 0px; } #bild_treppe{ position: relative; background: url(images/bild_treppe.jpg); width: 931px; height: 312px; margin-top: 0px; } #bild_all{ position: relative; margin-top: 0px; background-color:#f5f5f5; background: rgb(245, 245, 245); background-color: rgb(245, 245, 245); } #offerte_button{ position:absolut; width: 200px; height:70px; padding-top: 210px; padding-left: 111px; border:none; }#text{ position: relative; background-color:#add2e6; background-color:rgb(173, 210 230); background:rgb(173, 210 230); height: auto; width: 935px; margin: 0 auto; padding-top: 38px; margin-left: 10px; font-family: Verdana, Arial, Tahoma, sans-serif; font-size: 14px; font-style: italic; color: black; } #text h1 { width: 935px; position: relative; color: #616161; text-transform: uppercase; font-family: "Adobe Caslon Pro", "Hoefler Text", Georgia, Garamond, Times, serif; letter-spacing:0.1em; text-align: left; font-size: 30px; font-variant: small-caps; font-style:italic; }}#fusszeile{ border: 2px soild red; color: red; } #fusszeile{ width: 935px; margin-top: 30px; border: 2px soild red; width: 935px; text-align: center; font-family: Verdana, Arial, Tahoma, sans-serif; font-size: 12px; color: black; letter-spacing: 1px; /* Abstand zwischen den Buchstaben */ line-height: 1.5; margin-left: auto ; margin-right: auto ; /* Zeilenabstand, ohne Einheit */ }/******** LINK Fusszeile ********/#fusszeile a:link{ color: black; text-decoration: none; }#fusszeile a:visited{ color: black; text-decoration: none; }#fusszeile a:hover{ color: #7d8692; text-decoration: none; }/******** LINK Fusszeile ENDE********/CSS IE Code:
CSS
html { height: 100%;}body { /* Background:url(images/background.jpg);*/ background-color: #f5f5f5; background-color: rgb(245, 245, 245); /* The Fallback */ /* Hintergrundfarbe */ background: rgb(245, 245, 245); color: white; /* Schriftfarbe */ background-repeat:repeat-x; margin: 0 auto; height:100%;}#navigation{ position:relative; width: 935px; height: 41px; margin-left:205px; font-size: 21px; text-align: center; font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; letter-spacing: 2px; color: #7d8692; }#wrapper{ text-align:center; width:100%; min-height: auto; height:100% !important;/*automatische Hoehe*/ margin:0 auto;/*positioniert den wrapper in der Mitte des Browserfensters*/ /*background-color:#f5f5f5;*/ background-color: #add2e6; background-color:rgb(173, 210 230); background:rgb(173, 210 230);}Vielen Dank für die Hilfe!!
