zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Seite auf 100%

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 08.03.2011, 13:10
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 21.02.2011
Beiträge: 3
berti44 befindet sich auf einem aufstrebenden Ast
Standard Seite auf 100%

Hi, ich ein Anfänger, kann nur hoffen dass mir hier jemand hilft. Bin schon den ganzen Morgen dran die gefundenen Beschreibungen umzusetzen und komm zu keinem Ergebnis.
Ich möchte dass der footer immer unten am Bildschirm zu sehen ist also die Seite sich immer auf die Bildschirmhöhe ausdehnt.

Hier der Code meines letzten Versuchs:
Zitat:
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
body {
background-color: #CCC;
text-align: center;
margin: 0px;
padding: 0px;
height: 100%;
}
#container {
min-height: 100%;
text-align: left;
width: 1000px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
* html #container {
height: 100%;
}
#header {
background-color: #FFC;
height: 99px;
}
#navi {
background-color: #CFF;
}
#content {
background-color: #9F6;
height: 222px;
}
#footer {
position: relative;
background-color: #FFF;
}
</style>
</head>

<body>
<div id="container">
<div id="header">Raum für den Inhalt von id "header"</div>
<div id="navi">Raum für den Inhalt von id "navi"</div>
<div id="content">Raum für den Inhalt von id "content"</div>
<div id="footer">Raum für den Inhalt von id "footer"<br />
</div>
</div>
</body>
</html>
Was mach ich denn falsch?
Grüße aus Weilburg
Berti

PS ach ja, es sollte im Firefox und IE funktionieren

Geändert von berti44 (08.03.2011 um 13:12 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 08.03.2011, 13:41
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

Entweder sticky footer:
New CSS Sticky Footer - 2010 - HTML for Bottom of Page Footer
oder fixed footer --> siehe Forums FAQ

Manfred
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 08.03.2011, 15:27
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 21.02.2011
Beiträge: 3
berti44 befindet sich auf einem aufstrebenden Ast
Standard

[QUOTE=Manfred62;489446]Entweder sticky footer:
New CSS Sticky Footer - 2010 - HTML for Bottom of Page Footer
oder fixed footer --> siehe Forums FAQ

Manfred[/QUOTE

Leider hilft mir deine Antwort nicht weiter, der Link zu der englischen Seite bringt mir nichts da ich da ich nicht genug Englisch kann.
Der Hinweiß auf Forums FAQ kann ich nicht nachvollziehen denn ich finde keine Seite "FAQ"
Hättest du mir den Code abgeändert könnte ich sehen was ich falsch gemacht habe.
Na ja es ist fast immer so in den Foren, da hat ein Anfänger eben nichts zu suchen, ich muß halt sehen wie ich ohne Fachmännische Hilfe zurecht komme.
Gruß Berti
Mit Zitat antworten
  #4 (permalink)  
Alt 08.03.2011, 15:48
Benutzerbild von uspri
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 04.07.2005
Beiträge: 900
uspri sorgt für eine eindrucksvolle Atmosphäreuspri sorgt für eine eindrucksvolle Atmosphäre
Standard

Immer diese Ausreden.

Hier ist die FAQ: http://xhtmlforum.de/40267-faq-h-ufi...ragen-und.html
Mit Zitat antworten
  #5 (permalink)  
Alt 08.03.2011, 16:36
Neuer Benutzer
neuer user
 
Registriert seit: 02.03.2011
Beiträge: 26
vast befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Immer diese Ausreden.
Ich hab mich da auch schon blöd gesucht. Wenn man neu ist, geht man nicht unbedingt davon aus, das das ein Beitrag ist, sondern man durchsucht die Navi.
Mittlerweile bin ich aber auch schon drüber gestolpert.

Zitat:
Leider hilft mir deine Antwort nicht weiter, der Link zu der englischen Seite bringt mir nichts da ich da ich nicht genug Englisch kann.
Muss man auch nicht unbedingt, da sind rechts Links zum html und css, der Aufbau ist daraus eigentlich recht klar ersichtlich.

Für dein Dokument angewendet käme dabei sowas raus:

HTML-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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>

<!--[if !IE 7]>
	<style type="text/css">
		#container {display:table;height:100%}
	</style>
<![endif]-->


<style type="text/css">

/*  
Sticky Footer Solution
by Steve Hatcher 
http://stever.ca
http://www.cssstickyfooter.com
*/

* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body {height: 100%;}

#wrap {
	min-height: 100%;
	
	background-color: #99FF66; /*grün hier*/	
}

#main {overflow:auto;
	
	padding-bottom: 50px; /* Höhe von footer */
}  
#wrap,#footer {
margin: 0 auto;
width: 1000px;
}


/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

#header {
background-color: #FFC;
height: 99px;
}
#navi {
background-color: #CFF;
}
#content {
/*background-color grün entfernt, ist bei #wrap zur demonstration*/
height: 222px;
}

#footer {
position: relative;
background-color: #FFF;
margin: 0 auto;
margin-top: -50px; 
height: 50px; /* footer braucht zwingend feste Höhe */
clear:both;
}

</style>
</head>

<body>
<div id="wrap">
	<div id="main">
		<div id="header">Raum für den Inhalt von id "header"</div>
		<div id="navi">Raum für den Inhalt von id "navi"</div>
		<div id="content">Raum für den Inhalt von id "content"</div>
	</div>
</div>

<div id="footer">Raum für den Inhalt von id "footer"</div>

</body>
</html>
Ich habe die grüne Hintergrundfarbe von #content auf #wrap gelegt, evtl versteht man so besser was geschieht.

Die Sache funktioniert nur, wenn der Footer eine Höhe zugewiesen bekommt.

Klappt das?
Mit Zitat antworten
  #6 (permalink)  
Alt 08.03.2011, 18:32
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 21.02.2011
Beiträge: 3
berti44 befindet sich auf einem aufstrebenden Ast
Standard

Hallo vast,
Jetzt wo ich den Code sehe (der auch funktioniert), weiß ich dass ich das nie alleine hin bekommen hätte.
Vielen Dank für die Abänderung.
So sehe ich auch was ich garnicht beachtet habe (was auch in keiner Beschreibung stand, und glaub mir ich habe schon einige gelesen.
Genau wie die versteckte FAQ hier, da wird man drauf hingewiesen kann die aber nicht finden.
Wieso man nicht in die Navigation einen Button macht der suchende mit einem Klick zu der FAQ bringt ist unverständlich.

OK ich versuche nun den von dir abgeänderten Code durchzugehen und zu verstehen.

Mit Grüßen aus Weilburg und nochmals danke
Berti
Mit Zitat antworten
  #7 (permalink)  
Alt 08.03.2011, 19:22
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Fragen zu Darstellungsproblemen gehören in den Bereich CSS -- dort findest du auch die zugehörigen FAQ oben angeklebt.

Als Navigationspunkt ist das wenig geeignet, da es in diesem Board noch um sehr viel mehr Themenbereiche geht.

edit: Auf wunderbare Weise ist jetzt plötzlich ein FAQ-Link in der Navigation aufgetaucht. Hm -- halte ich nicht für sehr passend so allgemein.

Geändert von fricca (08.03.2011 um 19:28 Uhr)
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Wordpress Seite Passwort-Schützen? sepp88 Serveradministration und serverseitige Scripte 5 01.11.2009 12:56
Seite wird auf anderem Computer falsch dargestellt Patrick Egli CSS 3 01.11.2009 10:40
Shtml auf jeder Seite einbinden - counter iVx Serveradministration und serverseitige Scripte 1 13.09.2007 17:31
Fixer Header (CSS Frame) und Sprung zu Anker auf dieser Seite Chico_wau CSS 2 14.05.2007 18:08


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:39 Uhr.