|
|||
Das habe ich auch vor, jedoch will ich die ganzen Elemente "Nebeneinander und Übereinander positionieren....
Verzweiflung macht sich breit bei mir, verstehe ich wirklich noch sowenig von der ganzen Materie? |
Sponsored Links |
|
|||
So, vielleicht hilft das etwas mehr... Ich habe jedoch immer und immer wieder das Problem, dass ich zwischen Header und Content und Footer eine weisse leere Flache erhalte....
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> <link rel="stylesheet" type="text/css" href="css/screen.css"/> </head> <body> <div id="wrapper"> <div id="header"> <div id="logo"> Hier folgt das Logo </div> <div id="slogan"> Leicht, gesund und frisch zubereitet! </div> <div id="keymenu"> Hier kommt das Menu </div> </div> <div id="content"> <h1>Wieso klappt das nicht?</h1> </div> <div id="footer"> </div> </div> </body> </html> Code:
@charset "utf-8"; /* CSS Document */ /* ==================================================================== CSS Document for screendesign by Medienpixel Last Update: 22.09.2013 Author: Medienpixel.ch - Die Webagentur mit Pfiff Media: Screen Structure: 1 Kalibrierung 2 Allgemeine Definitionen 3. Anchors 4. Screendesign 5. Navigation 6. Form ======================================================================== */ /* ========================================== 1. Kalibrierung ========================================== */ *{ margin:0; padding:0; border:0; } html{ height:100%; margin-bottom:1px; } body{ height:100%; width:100%; } h1,h2,h3,p,ol, ul{ margin-bottom:1em; } ul ul, ol ol{ margin-bottom:0; } li{ margin-left:1em; } /* =========================================== 2. Allgemeine Definitionen =========================================== */ *{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; font-style: normal; font-weight: normal; text-decoration: none; text-align: left; } body{ background-color: #FFF; } h1,h2,h3 { } h1 { font-family: "Times New Roman", serif; font-size: 24px; font-weight: bold; color: #799439; margin-top: 0.5454em; margin-right: 0em; margin-bottom: 1.0909em; margin-left: 0em; } h2 { } h3 { } p { } strong { } em { } address { } blockqoute { } q { } /* =========================================== 3. Anchors =========================================== */ #wrapper { height: auto; width: 90.909090em; margin-top: 0em; margin-right: auto; margin-bottom: 0em; margin-left: auto; } #header { height: 24.5455em; width: 90.9091em; background-color: #000; border-top-width: 1.363636em; border-bottom-width: 0.454545em; border-top-style: solid; border-bottom-style: solid; border-top-color: #799439; border-bottom-color: #799439; z-index: 1; } #keymenu { background-color: #0F3; height: 11.3636em; width: 70.707em; z-index: 2; margin-left: 20.202em; margin-top: -165px; } #content { height: auto; width: 90.9091em; z-index: 0; background-color: #c4b4a1; } #footer { height: 5em; width: 90.909em; background-color: #000; border-top-width: 0.454545em; border-top-style: solid; border-top-color: #799439; } #logo { z-index: 3; background-color: #F00; height: 15.9091em; width: 15.9091em; margin-top: 5.2272em; margin-left: 3.030303em; } #slogan { /* [disabled]z-index: 4; */ /* [disabled]background-color: #909; */ /* [disabled]height: auto; */ /* [disabled]width: 70.707em; */ /* [disabled]margin-left: 20.202em; */ /* [disabled]margin-bottom: 250px; */ } |
|
||||
Da bist du Opfer von Collapsing Margins geworden.
Advanced CSS - Collapsing margins Cascading Style Sheets { Grundlegendes : Zusammenfallende Abstände (Collapsing Margins) }
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
Stichwörter |
css, html, position, z-index |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Welches Tool ist geeignet um eine sitemap zu erstellen? | misterbean | (X)HTML | 5 | 31.08.2012 16:52 |
Website erstellen - Layout Probleme | Jerry0022 | CSS | 3 | 14.06.2011 18:30 |
Probleme beim Erstellen einer Box | infected | CSS | 2 | 02.08.2008 19:23 |
Wie Hintergrundkachel bei em-Angaben erstellen? | Mr.T | CSS | 19 | 16.06.2007 03:29 |
z-index Ebene erstellen mit externe CSS Datei | Crizzo | CSS | 12 | 17.10.2006 15:56 |