zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hilfe beim Layout

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 21.11.2006, 19:02
Benutzerbild von claude
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 10.11.2004
Ort: Hamburg
Beiträge: 173
claude befindet sich auf einem aufstrebenden Ast
Standard Hilfe beim Layout

hallo,

ich glaube hier bin ich wohl erst einmal richtiger aufgehoben,

ich habe eigentlich ein recht einfaches Layout, aber trotzdem zwei Probleme:

1. leider ist bei einer niedrigeren Bildschirm Auflösung nicht mehr die komplette Seite zu sehen, hab gestern etwas gebastelt aber keine Lösung gefunden.

2. Wie bekomme ich den Footer an den unteren Rand der Seite?

Ich hoffe ihr könnt mir helfen, schon einmal vielen Dank

points-kochstudio

Code:
/* CSS Stylesheet */
*{margin:0;padding:0;}
body {
background:#fff;
font-family:'Trebuchet MS', 'Bitstream Vera Sans', Verdana, Arial,  Helvetica, sans-serif;}

#container{
margin:0 auto;}


/* --- header --- */
#header {
background:url(images/header.jpg) repeat-x;
height:125px;}

/* --- navigation --- */
#nav {
font-family:Century Gothic, "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
display:block;
padding:85px 0 0 10px;}
#nav li {
float:left;
list-style:none;}
#nav li a {
display:block;
padding:7px 12px 14px 12px;
color:#c0c0c0;
text-decoration:none;
line-height:14px;
font-size:0.9em;}
#nav li a:hover, #nav li a.active {
background-image:url(images/menu_a_hover.gif);
background-position:bottom;
background-repeat:repeat-x;
color:#fff;}


/* ---- sidebar --- */
.sidebar {
float:left;
width:200px;
margin:10px 0 0 0;}
.sidebar h1 {
font-family:Century Gothic, "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size:1.1em;
color:#AEADAD;
font-weight:normal;
letter-spacing:1px;
padding:5px 0 5px 10px;}
.sidebar ul {
background: url(images/sidebar.gif) no-repeat top left;
list-style:none;
margin:20px 0 50px 0;}
.sidebar li{
width:200px;
border-bottom: 1px solid #eee;
font-family:'Trebuchet MS', 'Bitstream Vera Sans', Verdana, Arial,  Helvetica, sans-serif;
color:#858484;
font-size:0.7em;
letter-spacing:1px;
padding:2px 0 2px 0;}
.sidebar li a{
color:#858484;
text-decoration:none;
padding:0 0 0 10px;}
.sidebar li a:hover{
color:#80151A;}

/* --- content --- */
#content {
float: left;
width:650px;
padding:30px 50px 50px 60px;}
#content p {
font-family:Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
font-size:0.9em;
line-height:1.3em;
word-spacing:0.3em;
margin:0 0 8px 0;}
#content h1 {
font-family:Century Gothic, "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size:1.0em;
letter-spacing:1px;
margin:0 0 10px 0;}
#content h2 {
font-family:Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
font-size:1.0em;
letter-spacing:0.6em;
margin:0 0 10px 0;}
#content h3 {
font-size:0.8em;
font-weight:normal;
color:#918E8E;
background:#F4E083;
border-top:1px solid #E6E6E6;
border-bottom:1px solid #E6E6E6;
margin:0 0 10px 0;
padding:2px 0 2px 5px;}


/* -- postmetadata --*/
.postmetadata{
font-size:0.6em;
color:#666;
border-top:1px solid #ddd;
border-bottom:1px solid #ddd;
background-color:#f4f4f4;}
.postmetadata a{
color:#666;}
.postmetadata a:hover{
color:#80151A;
text-decoration: underline;}




/* --- footer --- */
#footer {
clear:both;
height:50px;
background:#555;
color:#AEADAD;
text-align:center;
font-size:0.8em;
padding:5px 0 0 0;}
#footer a {
color:#AEADAD;}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 22.11.2006, 03:59
Benutzer
neuer user
 
Registriert seit: 14.11.2006
Ort: Österreich
Beiträge: 37
punctilio befindet sich auf einem aufstrebenden Ast
Standard

#content {
float: left;
width:650px;
padding:30px 50px 50px 60px;}

Ist schuld daran! Da du hier eine fixe Breite angibst, ist es klar dass das Menü nach unten wandert sobald es sich nicht mehr ausgeht! width: 60%; oder dergleichen wäre hier praktischer!
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 22.11.2006, 18:34
Benutzerbild von claude
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 10.11.2004
Ort: Hamburg
Beiträge: 173
claude befindet sich auf einem aufstrebenden Ast
Standard

hallo, vielen Dank für die Antwort, aber eine Lösung war es leider nicht....
Mit Zitat antworten
  #4 (permalink)  
Alt 22.11.2006, 18:40
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

Wenn du mit Prozentbreiten arbeitest, dann für Inhalt und Menü.
Und denk an das Box-Modell. Padding wird zu width addiert!

Footer ganz nach unten: siehe FAQ Punkt 7.
Mit Zitat antworten
  #5 (permalink)  
Alt 22.11.2006, 19:13
Benutzerbild von claude
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 10.11.2004
Ort: Hamburg
Beiträge: 173
claude befindet sich auf einem aufstrebenden Ast
Standard

nee, dazu bin ich wohl zu blöd, klappt nicht oder kapier ich nicht
Zitat:
Footer ganz nach unten: siehe FAQ Punkt 7.
Mit Zitat antworten
Jetzt hängt der Footer im Header .....
Mit Zitat antworten
  #6 (permalink)  
Alt 22.11.2006, 19:21
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

Der Footer muss außerhalb des 100%-hohen Containers stehen.
Schau dir den Code genau an und lies die Erklärung.

Deinem Gefloate fehlt noch ein clear. Siehe FAQ Punkt 2.
Mit Zitat antworten
  #7 (permalink)  
Alt 22.11.2006, 19:24
Benutzer
neuer user
 
Registriert seit: 14.11.2006
Ort: Österreich
Beiträge: 37
punctilio befindet sich auf einem aufstrebenden Ast
Standard

<div id="noFooter">
da kommt alles rein, ausser footer
</div>
Und dann erst
<div id="footer">
</div>
Mit Zitat antworten
  #8 (permalink)  
Alt 22.11.2006, 20:33
Benutzerbild von claude
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 10.11.2004
Ort: Hamburg
Beiträge: 173
claude befindet sich auf einem aufstrebenden Ast
Standard

okay, Vielen an euch beide, jetzt sieht es gut aus
Mit Zitat antworten
  #9 (permalink)  
Alt 22.11.2006, 20:50
Benutzer
neuer user
 
Registriert seit: 14.11.2006
Ort: Österreich
Beiträge: 37
punctilio befindet sich auf einem aufstrebenden Ast
Standard

perfekt ist es noch nicht!
Erhöh noch den Margin wert von footer um ein wenig
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 22.11.2006, 20:57
Benutzerbild von claude
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 10.11.2004
Ort: Hamburg
Beiträge: 173
claude befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Erhöh noch den Margin wert von footer um ein wenig
Mit Zitat antworten
Code:
html{height:98%;}
body{height:98%;}
#nonFooter{
position: relative;
min-height:98%;}
* html #nonFooter{
height:98%;}
#footer{
position: relative;
margin:0 auto 0 auto;}
/* A CSS hack that only applies to IE -- specifies a different height for the footer */
* html #footer{margin-top:0;}
Wie meinst du das, den Margin wert erhöhen? Wo genau?
Mit Zitat antworten
Sponsored Links
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
Bitte um Layout hilfe gunnar_hst CSS 0 20.06.2010 14:57
Layout selbst coden - Hilfe ! kgsbm CSS 3 25.03.2008 19:25
Hilfe bei gesamten CSS Layout mexxat CSS 0 22.08.2007 13:40
Brauche Hilfe beim 2-Spaltigen Layout Kaimane CSS 1 15.08.2007 00:10
Hilfe beim Layout erstellen kevink CSS 9 24.06.2007 18:13


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:30 Uhr.