• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

CSS Seiten länge

P

Patrick.Senftleben

Neues Mitglied
Hallo,
ich habe nun schon einige zeit versucht die Seitenlänge von meiner Seite zu verändern.
Denn, die Seite ist ca. 1000 bis 2000px länger als etwas endet.(der footer).
Ich möchte das die Seite bzw. der bg direkt hinter dem footer endet.
Bitte nicht über den CSS Code meckern, ich bin anfänger.

CSS CODE:
Code: 
/* 
    Document   : style.css
    Created on : 11.11.2010 18.00
    Author     : Patrick Senftleben
    Description:
        Purpose of the stylesheet follows.
*/


.content {
    background-color:#00;
    margin-left:auto;
    margin-right:auto;
    width:auto;
    height:auto;
}

.left {
    background-image:url(images/datei_01.gif);
    background-repeat:no-repeat;
    width:228px;
    height:900px;
}

.header {
    background-image:url(images/datei_16.gif);
    position:relative;
    top:-895px;
    left:228px;
    background-repeat:no-repeat;
    width:747px;
    height:184px;
}

.right {
    background-image:url(images/datei_15.gif);
    position:relative;
    top:-1080px;
    left:975px;
    width:225px;
    height:893px;
}


.news {
    position:absolute;
    top:173px;
    left:250px;
    background-repeat:no-repeat;
    width:85px;
    height:24px;
}

.team {
    position:absolute;
    top:0px;
    left:150px;
    background-repeat:no-repeat;
    width:85px;
    height:24px;
}

.forum {
    position:absolute;
    top:0px;
    left:125px;
    background-repeat:no-repeat;
    width:85px;
    height:24px;
}

.shop {
    position:absolute;
    top:0px;
    left:110px;
    background-repeat:no-repeat;
    width:85px;
    height:24px;
}

.text {
    background-image:url(images/datei_22.gif);
    position:relative;
    top:-1814px;
    left:228px;
    background-repeat:inherit;
    width:747px;
    height:742px;
}


.footer {
    background-image:url(images/datei_21.gif);
    position:relative;
    top:-1820px;
    left:223px;
    background-repeat:inherit;
    width:744px;
    height:264px;
}
Schonmal ein Danke an alle.

Edit://
Es, liegt an dem HTML teil, in der index.html wie ich denke.
Denn mit jedem </div> geht es immer ein stück tiefer.
Daher bitte ich nun um hilfe.
CSS Code oben.
HTML Code hier:
Code: 
<!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">
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Startseite</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/*<![CDATA[*/
 body {
  background-color: #000;
 }
/*]]>*/
</style>
</head>
<body>
<div class="content"></div>
<div class="left"></div>
<div class="header"></div>
<div class="right"></div>
<div class="text"></div>
<div class="footer"></div>
<div class="news"><a href="news.html" onmouseover="window.status='News-Seite'; return true;" onmouseout="window.status=''; return true;"><img src="images/datei_03.gif" width="95" height="25" border="0" alt="" /></a>
<div class="team"><a href="team.html" onmouseover="window.status='Team-Seite'; return true;" onmouseout="window.status=''; return true;"><img src="images/datei_04.gif" width="95" height="25" border="0" alt="" /></a>
<div class="forum"><a href="forum.html" onmouseover="window.status='Forum'; return true;" onmouseout="window.status=''; return true;"><img src="images/datei_07.gif" width="95" height="25" border="0" alt="" /></a>
<div class="shop"><a href="shop.html" onmouseover="window.status='Shop'; return true;" onmouseout="window.status=''; return true;"><img src="images/datei_09.gif" width="95" height="25" border="0" alt="" /></a></div>
<a href="shop.html" onmouseover="window.status='Shop'; return true;" onmouseout="window.status=''; return true;"></a></div>
</div>
</div>
</body>
</html>
 
Zuletzt bearbeitet:
Dein HTML-Code ist nicht valide, korrigier das erstmal. Und dann solltest Du mal hinterfragen wieso Du 1300 Pixel als Höhe für .content angibst.
 
Mhh. ich habe probiert, den code zu validieren, jedoch verstehe ich es nicht.
Es zeigt mit z.B bei <body color> an das das > falsch ist....

Und das CSS hab ich unter contect auf 1300px eingegeben, weil die grafiken so lang sind.
 
Hallo.

Dein <body> wird geöffnet bevor der <head> geschlossen wird.

Ganz am Ende der Datei öffnest du dann noch einmal ein <body>.

Schau dir noch einmal den Aufbau eines HTML Grundgerüsts an und verbessere dann die Fehler.

Gruss
Elroy
 
So, danke für den Tipp.
So, die HTML Datei ist valid.
Die CSS datei wurde auch bearbeitet.
Er zeigt nun an sich alles ganz gut an.
Jedoch, ist noch immer ein abstand von mehr als 1000px unter dem footer.
Ich bitte daher nochimmer um hilfe
 
Ursache ist definitiv, dass Du relative Positionierung für diese Darstellung missbrauchst. Verwende bei den Elementen die Du derzeit damit ausrichtest statt dessen (!) float und margin um sie an die richtigen Stellen zu bringen. Dazu musst Du ggfs. auch die Reihenfolge der Elemente ändern. Aber auf position: relative musst Du verzichten.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben