Willkommen
myGully
Links
Forum
02.11.11, 19:07
#1
Erfahrener Newbie
Registriert seit: Dec 2010
Ort: Luzern, Schweiz
Beiträge: 144
Bedankt: 553
Problem mit Webseitenbreite
Hallo Zusammen
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?
Habe Lösung gefunden! Bei Fragen bitte PN
Bild (Size: 535 X 708px): Blau Markierte ist der HTML Tag. Man sieht schön, wie er plötzlich endet.
HTML & PHP Code:
PHP-Code:
<?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:
Vielen Dank für die Hilfe!!
__________________
Win7 x64 + Ubuntu 11.04 AMD Phenom X4 Black Edition 955, 8GB RAM, Asus 5770
Falls Links down sein sollten bitte PN!
02.11.11, 21:01
#2
Keks-süchtig
Registriert seit: Feb 2011
Beiträge: 1.051
Bedankt: 749
cool story bro. aber ich denke du hast die frage vergesse.
09.11.11, 20:33
#3
Erfahrener Newbie
Registriert seit: Dec 2010
Beiträge: 162
Bedankt: 18
Zitat:
Zitat von
KEKSEEEE
cool story bro. aber ich denke du hast die frage vergesse.
Wenn er sein Problem beschreibt, ist es doch klar, dass er eine Lösung dafür möchte!
Schau dir mal die Metrics an, vielleicht findest du da was!
Forumregeln
Du kannst keine neue Themen eröffnen
Du kannst keine Antworten verfassen
Du kannst keine Anhänge posten
Du kannst nicht deine Beiträge editieren
HTML-Code ist Aus .
Alle Zeitangaben in WEZ +1. Es ist jetzt 08:12 Uhr.
().