zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Header - Leftmenue, Kontent 100% - footer CSS und keine Scrollbars!

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 25.06.2008, 09:50
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.06.2008
Beiträge: 5
Mavarik befindet sich auf einem aufstrebenden Ast
Cool Header - Leftmenue, Kontent 100% - footer CSS und keine Scrollbars!

Hallo Zusammen!

Nachdem ich eigentlich immer – wegen den Problemen – Layouts mit Tabellen erstellt habe, möchte ich auf CSS umstellen.

Leider mußte ich feststellen, dass egal welche Hacks und welche Tricks ich anwende, NIE das gewünschte Seitenverhalten zu erstellen war.

Ich will auch überhaupt keine Diskussion starten ob CSS oder Tabellen besser sind oder welcher Browser schlecht und welcher gut ist.

Aufgabenstellung ist ein Layout mit:

Header width:100%, height:179px
Kontentbereich mit Leftmenü Width:200px, Height 100% (wobei hier die 100% Browserfenster, abzüglich header und footer ist.
Footer width 100%, height:25px

Soweit so gut.

Wenn ich einen DIV Container für den Kontentbereich erzeugen mit height:100% und vorher html,body height:100% gesetzt habe, erhalte ich immer eine vertikale scrollleiste die in der Höhe des Headers ist und unter dem Footer ist auch noch der Inhalt des Kontentbereiches…

Oder

Firefox stellt das Menue nicht mit 100% da und es fehlt somit der Hintergrund. (Immer vorausgesetzt der Kontent ist kurz und schiebt nicht sowieso den Footer bis unten)

Hat jemand eine Idee wie ich das hinkriege?

Beispiel : www.delphiprofi.de oder nordic-and-more.de

Grüße Frank

Natürlich funktioniert das ganze im IE & Firefox ohne DOC-Type und mit Tabellen!
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 25.06.2008, 10:55
Benutzer
neuer user
 
Registriert seit: 29.04.2008
Beiträge: 56
sjBlack ist in Verruf geraten
Standard

gibste die hintergrundfarbe/hintergrundgrafik body oder html, wirds auf die leinwand projeziert, brauchste die 100% height nimmer.

wow, du brauchst nen 100% width divider. was muss man tun, damit nen div vollstmögliche breite annimt? mal überlegen... nix automatische breite von divs im normal flow bezieht sich auf extend to shrank, nimmt volle breite ein. also bloß die gewünsche höhe und de hintergrundgrafik (den banner)

Zitat:
Wenn ich einen DIV Container für den Kontentbereich erzeugen mit height:100% und vorher html,body height:100% gesetzt
brauchst du einen content bereich?

Zitat:
mit height:100% und vorher html,body height:100% gesetzt habe, erhalte ich immer eine vertikale scrollleiste die in der Höhe des Headers ist und unter dem Footer ist auch noch der Inhalt des Kontentbereiches…
ja, wegen dem boxmodell. außenabstände und innenabstände werden einem block dazugerechnet. dann schießt das ganze ausm viewport.

wenn du realvnc hast und skype, kann ich ja mal remote vorbeischaun.

Geändert von sjBlack (25.06.2008 um 11:00 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 25.06.2008, 11:05
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.06.2008
Beiträge: 5
Mavarik befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von sjBlack Beitrag anzeigen
wow, du brauchst nen 100% width divider. was muss man tun, damit nen div vollstmögliche breite annimt? mal überlegen... nix automatische breite von divs im normal flow bezieht sich auf extend to shrank, nimmt volle breite ein. also bloß die gewünsche höhe und de hintergrundgrafik (den banner)
width? um die Width geht es doch gar nicht, sonder um die height!
Zitat:
Zitat von sjBlack Beitrag anzeigen
brauchst du einen content bereich?
hmm.. Logisch...(Also ich bezeichne als content das was als Inhalt auf die Seite kommt, mal abgesehen davon, dass ich ASP.NET Seiten 2.0 erstelle und das Layout in der Masterseite ist und der Content in den einzelnen...

Zitat:
Zitat von sjBlack Beitrag anzeigen
wenn du realvnc hast und skype, kann ich ja mal remote vorbeischaun.
Skype ginge.. (Danke für das Angebot)

Grüsse Mavarik66

Geändert von Mavarik (25.06.2008 um 11:08 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 25.06.2008, 11:32
Benutzer
neuer user
 
Registriert seit: 29.04.2008
Beiträge: 56
sjBlack ist in Verruf geraten
Standard

ehrlich gesagt bin ich gerade zu müde, um zu verstehen, was genau du erreichen willst. sowas ähnliches wie auf meiner seite? - simpleml.bplaced.net - xhtml und css tutorials, artikel, video tutorials, referenzen und nachschlagwerke

paar divs und das wars, kannste im stylesheet abgucken.

Zitat:
Skype ginge.. (Danke für das Angebot)
ja doll, nur was bringt's ohne remote desktop. naja, wenn du linux user bist wirds eh nix mit'm rdp

Geändert von sjBlack (25.06.2008 um 11:35 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 25.06.2008, 11:35
Benutzer
neuer user
 
Registriert seit: 29.04.2008
Beiträge: 56
sjBlack ist in Verruf geraten
Standard

// edit
falscher topic. pls delete - diesen post selbstverständlich
Mit Zitat antworten
  #6 (permalink)  
Alt 25.06.2008, 11:45
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.06.2008
Beiträge: 5
Mavarik befindet sich auf einem aufstrebenden Ast
Standard

[QUOTE=sjBlack;391293]ehrlich gesagt bin ich gerade zu müde, um zu verstehen, was genau du erreichen willst. sowas ähnliches wie auf meiner seite?[/url]

Nein so wie das Layout, welches ich zur Zeit mit Tabellen mache!

Zitat:
Zitat von sjBlack Beitrag anzeigen
ja doll, nur was bringt's ohne remote desktop. naja, wenn du linux user bist wirds eh nix mit'm rdp
Nein.. nicht *nix Vista...

Habe dich in meinem MSN Messenger eingetragen!

Hiernochmal meine Tests

So sollte es aussehen, jedoch kein content unter footer und ohne Scrollleisten
Scolleisten und footer zu tief
Scolleisten und footer zu tief ohne Positionierungsangaben

Grüsse Frank

Geändert von Mavarik (25.06.2008 um 13:16 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 27.06.2008, 10:29
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.06.2008
Beiträge: 5
Mavarik befindet sich auf einem aufstrebenden Ast
Frage

Zitat:
Zitat von sjBlack Beitrag anzeigen
paar divs und das wars, kannste im stylesheet abgucken.
Hast Du eine Lösung für mein Problem, oder gibt es da keine?

Grüsse Frank
Mit Zitat antworten
  #8 (permalink)  
Alt 21.07.2008, 19:40
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.06.2008
Beiträge: 5
Mavarik befindet sich auf einem aufstrebenden Ast
Standard Header - Leftmenue, Kontent 100% - footer CSS und keine Scrollbars!

Push!

Hallo! Keine Idee wie das geht?

Grüsse Frank
Mit Zitat antworten
  #9 (permalink)  
Alt 26.07.2008, 17:11
Neuer Benutzer
neuer user
 
Registriert seit: 11.06.2008
Beiträge: 14
burnZ befindet sich auf einem aufstrebenden Ast
Standard DIV bis GANZ untent

ICH BIN DUMM DAS SOLLTE EIN NEUER THREAD WERDEN BITTE LÖSCHEN

Hallöchen Leute,

muss doch nochmal im Hilfe bitten hab wirklich versucht zu suchen aber ich denke ich suche nur falsch kann mir nicht vorstellen das die Frage noch nie gefallen ist eher im Gegenteil ^^

Alsooo ich hab ein "Submenu" DIV und dein "Content" Div nebeneinander, das ganze ist verschachtelt in andere DIVs, html/body 100% Höhe der Wrapper ebenfalls. Dachte ich könnte mit relative/absolute arbeiten um zu erreichen was ich will. Und zwar sollen die besagten DIVs von unter dem Banner bis GANZ unten gehen also bis zum Ende des dynamischen Contents, und nicht nur bis zum Bottom des Browserinhalts, was wohl durch bottom: 0px; passiert. Ich hab das auch irgendwo schonmal ziemlich easy hinbekommen bin ich mir sicher aber ich finds einfach nicht mehr...

Aber trotzdem dank des Forums bin ich schon viel frischer in Sachen CSS/DIV statt Table Design Danke an der Stelle dafür!

Ich poste einfach mal HTML sowie CSS, Backgrounds könnt ihr ja durch Farben ersetzen...

Code:
@charset "utf-8";
/*******************************************************************
	JPH-DEV.NET 1.0.0.0 2008
		MAIN STYLESHEET FILE
********************************************************************/

*
{
	margin	: 0px;
	padding	: 0px;
}

html, body
{
	width		: 100%;
	height		: 100%;
	background	: #000000;
}

#root
{
	position: relative;
	width	: 100%;
	height	: 100%;
}

#root .page
{
	position	: relative;
	width		: 1000px;
	height		: 100%;
	margin-left	: auto;
	margin-right: auto;
}

#root .banner
{
	background: url( "../images/banner.jpg" );
	width	  : 1000px;
	height	  : 90px;
}

#submenu 
{
	position			: absolute;
	background-repeat	: repeat-y;
	width				: 228px;
	top					: 90px;
	bottom				: 0px;
	left				: 0px;
	background-image	: url(../images/submenu_repeat.jpg);
	background-position : 0px 33px;
}

#submenu .begin
{
	position			: absolute;
	background			: url( "../images/submenu_begin.jpg" );
	width				: 228px;
	height				: 33px;
	top					: 0px;
	left				: 0px;	
	z-index				: 0;
}

#submenu .container
{
	position: absolute;
	width	: 228px;
	height	: auto;
	z-index : 10;
	top		: 0px;
	left	: 0px;	
}

#submenu .normal
{
	background	: url( "../images/submenu_normal.jpg" );
	width		: 184px;
	height		: 21px;
	margin-top  : 2px;
	padding-left: 40px;
	padding-top	: 7px;
}

#submenu .active
{
	background	: url( "../images/submenu_active.jpg" );
	width		: 184px;
	height		: 21px;
	margin-top  : 2px;
	padding-left: 40px;
	padding-top	: 7px;
	font-family	: Arial, Helvetica, sans-serif;
	font-size	: 12px;
	color		: #FFFFFF;
}

#submenu .normal a
{
	font-family		: Arial, Helvetica, sans-serif;
	font-size		: 12px;
	color			: #999999;
	text-decoration	: none;
}

#content
{
	background	: url( "../images/content_repeat.jpg" );	
	width		: 772px;
	position	: absolute;
	top			: 90px;
	bottom		: 0px;
	left		: 228px;
}

#content .begin
{
	background	: url( "../images/content_begin.jpg" );	
	width		: 772px;
	height		: 103px;
	position	: absolute;
	top			: 0px;
	left		: 0px;
	z-index		: 0;
}

#content .end
{
	background	: url( "../images/content_end.jpg" );	
	width		: 772px;
	height		: 417px;
	position	: absolute;
	bottom		: 0px;
	left		: 0px;
	z-index		: 0;
}

#content .content
{
	position: absolute;
	width	: 752px;
	bottom	: 10px;
	left	: 10px;
	right	: 10px;
	top		: 10px;
	z-index : 10;
}
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>JPH-DEV.NET MAIN TEMPLATE</title>
<link href="css/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div id="root">
    	<div class="page">
        	<div class="banner"></div>
            <div id="submenu">
            	<div class="begin"></div>
                <div class="container">
                	<div class="normal"><a href="#">About Me</a></div>
                    <div class="active">About You</div>
                	<div class="normal"><a href="#">About Me</a></div>
                    <div class="active">About You</div>
                </div>
            </div>
            <div id="content">
            	<div class="begin"></div>
                <div class="end"></div>
                <div class="content">
                Nachdem Latein ursprünglich in Rom und der umliegenden Region (Latium) gesprochen worden war, verbreitete es sich nach und nach in den von Rom eroberten Gebieten. Neben Griechisch war Latein die Amtssprache des römischen Reiches. Dabei blieb die lateinische Hochsprache seit augusteischer Zeit (um Christi Geburt) in Syntax und Grammatik (ungeachtet stilistischer Veränderungen) weitgehend unverändert, während sich das gesprochene Vulgärlatein von einer flektierenden zu einer stärker analytischen Sprache weiter entwickelte. Der deutsche Altphilologe Wilfried Stroh zieht daraus den Schluss, dass das hochsprachliche Latein bereits seit dem 1. Jahrhundert n. Chr. faktisch eine tote Sprache war[1]. Wegen der kulturellen Überlegenheit des Ostens verlor das Lateinische zeitweise in Nordafrika und selbst in Rom in bestimmten Zusammenhängen seine Vorrangstellung. So war die Liturgiesprache der römischen Christen bis um 200 das Griechische. In dieser Zeit flossen zahlreiche griechische Lehnwörter ins Lateinische ein (hierbei war besonders der Einfluss Tertullians entscheidend). Insgesamt betrachtet war Latein aber seit dem 1. Jahrhundert die lingua franca der westlichen Reichshälfte und verdrängte vielfach die vorrömischen Sprachen.

Während der Spätantike (seit ca. 300) begannen sich verschiedene Volkssprachen und Mundarten phonetisch und grammatikalisch immer stärker von der lateinischen Hochsprache wegzuentwickeln. Diese auf dem Vulgärlatein basierenden regionalen Dialekte leben heute in den verschiedenen romanischen Sprachen fort. Obwohl das Hochlateinische in der ausgehenden Spätantike bzw. im frühen Mittelalter nicht mehr gesprochen wurde, entstanden noch im 6. Jahrhundert Werke in klassischem Latein (Boethius, Corippus). Noch Papst Gregor der Große ging um 600 davon aus, dass seine auf Latein verfassten Predigten vom einfachen Volk verstanden würden; alles spricht dafür, dass erst im späten 8. Jahrhundert Latein und die romanischen Volkssprachen als unterschiedliche Sprachen wahrgenommen wurden: Als epochales Datum gilt oft das Konzil von Tours im Jahr 813, auf dem beschlossen wurde, fortan Predigten in den „Volkssprachen“ zuzulassen, da die Gläubigen kein Latein mehr verstünden.

Im Oströmischen Reich war Latein bis ins frühe 7. Jahrhundert neben Griechisch eine der beiden offiziellen Amtssprachen. Danach wurde es in Byzanz nur noch von sehr wenigen Gelehrten verstanden.

Im Westen übernahmen die Germanen mit den Grundelementen der spätrömischen Verwaltung auch die lateinische Sprache, die in der Verwaltung bis in die frühe Neuzeit vorherrschend blieb. Seit der Völkerwanderung und Christianisierung der (zunächst zumeist arianischen) Germanenvölker wurde Latein im Westen des früheren Römischen Reiches und in den römisch-katholischen Folgestaaten Sprache des Klerus (Kirchenlatein), der Rechtswissenschaft (Glossatoren) und der sich bildenden Hochschulen (studia generalia) verwendet. Latein bildete somit die Schriftsprache, vor allem für das kirchliche und weltliche Urkundenwesen (Diplomatik) im frühen Europa.

In völkerrechtlichen Verträgen (z. B. im Westfälischen Frieden von 1648) dominierte Latein bis in das 17. Jahrhundert hinein. Es bildet noch bis ins 20. Jahrhundert den Affixvorrat für die Terminologie in den Wissenschaften und verliert durch die fortschreitende Absorption in die englische und andere Sprachen lediglich an direkter, nicht jedoch an indirekter Bedeutung. Es wird an vielen Schulen unterrichtet.

                Nachdem Latein ursprünglich in Rom und der umliegenden Region (Latium) gesprochen worden war, verbreitete es sich nach und nach in den von Rom eroberten Gebieten. Neben Griechisch war Latein die Amtssprache des römischen Reiches. Dabei blieb die lateinische Hochsprache seit augusteischer Zeit (um Christi Geburt) in Syntax und Grammatik (ungeachtet stilistischer Veränderungen) weitgehend unverändert, während sich das gesprochene Vulgärlatein von einer flektierenden zu einer stärker analytischen Sprache weiter entwickelte. Der deutsche Altphilologe Wilfried Stroh zieht daraus den Schluss, dass das hochsprachliche Latein bereits seit dem 1. Jahrhundert n. Chr. faktisch eine tote Sprache war[1]. Wegen der kulturellen Überlegenheit des Ostens verlor das Lateinische zeitweise in Nordafrika und selbst in Rom in bestimmten Zusammenhängen seine Vorrangstellung. So war die Liturgiesprache der römischen Christen bis um 200 das Griechische. In dieser Zeit flossen zahlreiche griechische Lehnwörter ins Lateinische ein (hierbei war besonders der Einfluss Tertullians entscheidend). Insgesamt betrachtet war Latein aber seit dem 1. Jahrhundert die lingua franca der westlichen Reichshälfte und verdrängte vielfach die vorrömischen Sprachen.

Während der Spätantike (seit ca. 300) begannen sich verschiedene Volkssprachen und Mundarten phonetisch und grammatikalisch immer stärker von der lateinischen Hochsprache wegzuentwickeln. Diese auf dem Vulgärlatein basierenden regionalen Dialekte leben heute in den verschiedenen romanischen Sprachen fort. Obwohl das Hochlateinische in der ausgehenden Spätantike bzw. im frühen Mittelalter nicht mehr gesprochen wurde, entstanden noch im 6. Jahrhundert Werke in klassischem Latein (Boethius, Corippus). Noch Papst Gregor der Große ging um 600 davon aus, dass seine auf Latein verfassten Predigten vom einfachen Volk verstanden würden; alles spricht dafür, dass erst im späten 8. Jahrhundert Latein und die romanischen Volkssprachen als unterschiedliche Sprachen wahrgenommen wurden: Als epochales Datum gilt oft das Konzil von Tours im Jahr 813, auf dem beschlossen wurde, fortan Predigten in den „Volkssprachen“ zuzulassen, da die Gläubigen kein Latein mehr verstünden.

Im Oströmischen Reich war Latein bis ins frühe 7. Jahrhundert neben Griechisch eine der beiden offiziellen Amtssprachen. Danach wurde es in Byzanz nur noch von sehr wenigen Gelehrten verstanden.

Im Westen übernahmen die Germanen mit den Grundelementen der spätrömischen Verwaltung auch die lateinische Sprache, die in der Verwaltung bis in die frühe Neuzeit vorherrschend blieb. Seit der Völkerwanderung und Christianisierung der (zunächst zumeist arianischen) Germanenvölker wurde Latein im Westen des früheren Römischen Reiches und in den römisch-katholischen Folgestaaten Sprache des Klerus (Kirchenlatein), der Rechtswissenschaft (Glossatoren) und der sich bildenden Hochschulen (studia generalia) verwendet. Latein bildete somit die Schriftsprache, vor allem für das kirchliche und weltliche Urkundenwesen (Diplomatik) im frühen Europa.

In völkerrechtlichen Verträgen (z. B. im Westfälischen Frieden von 1648) dominierte Latein bis in das 17. Jahrhundert hinein. Es bildet noch bis ins 20. Jahrhundert den Affixvorrat für die Terminologie in den Wissenschaften und verliert durch die fortschreitende Absorption in die englische und andere Sprachen lediglich an direkter, nicht jedoch an indirekter Bedeutung. Es wird an vielen Schulen unterrichtet.
                </div>
            </div>
        </div>
    </div>
</body>
</html>
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
100%, css

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
Mambo-Site in CSS...Footer nicht unten... timail CSS 3 02.06.2005 21:56
Probleme mit CSS und Footer schaki CSS 1 23.05.2005 18:57
div zentriert ? malo.conny CSS 2 26.04.2005 08:40
Footer Problem blub19 CSS 6 25.01.2005 11:46
css box design in header und footer trennen GateKay CSS 1 08.01.2005 14:54


Alle Zeitangaben in WEZ +2. Es ist jetzt 23:51 Uhr.