|
|||
Hi Praktikant
das klingt alles sehr schön, nur wie du Elemente die position:fixed; sind (und das sollten die beiden Sidebars sein), floaten willst leuchtet mir jetzt nicht ein. Aber ich freue mich schon, deine Lösung hier zu sehen. Lieben Gruß Webcoder
__________________
Websites erstellen ist ein Hobby von mir. |
Sponsored Links |
|
|||
Zitat:
__________________
Websites erstellen ist ein Hobby von mir. |
|
|||
Zitat:
Darum auch mein Vorschlag zu einem anderen Layout.
__________________
Websites erstellen ist ein Hobby von mir. |
|
|||
Zitat:
Es gibt durchaus auch ohne Javascript Möglichkeiten.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
also ich hab mich nochmal hingesetzt und mal was zusammen gebaut …
was scheinbar funktioniert … vielleicht mag ja mal jemand drauf gucken und abschätzen ob das so okay ist … oder man das besser anders macht … mir ist nicht ganz klar warum der page wrapper nicht die elemente umschließt … wahrscheinlich wohl, weil die elemente nicht relative sind, oder? HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>untitled</title> <meta name="generator" content="TextMate http://macromates.com/"> <meta name="author" content="Volker Racho"> <!-- Date: 2011-10-24 --> <link rel="stylesheet" type="text/css" href="style.css" type="text/css" /> </head> <body> <div id="pageWrapper"> <div id="header"></div> <div id="leftSidebar"></div> <div id="contentWrapper"> <div id="contentContainer"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div> </div> <div id="rightSidebar"></div> </div> </body> </html> Code:
#pageWrapper { border: 1px solid red; width: 1000px; height: 100%; display: block; margin-left: auto; margin-right: auto; position: relative; padding: 0; } /* warum ist der pageWrapper nicht so hoch wie der content inhalt? kann man das irgendwie machen?*/ #header { border: 1px solid red; width: 1000px; height: 200px; position: fixed; background-color: white; z-index: 2; } #leftSidebar { border: 1px solid red; width: 200px; height: 600px; position: fixed; background-color: gray; } #contentWrapper { border: 1px solid red; width: 600px; background-color: aqua; position: absolute; left: 200px; top: 200px; } .item { width: 130px; height: 300px; background-color: red; border: 2px dashed blue; float: left; margin: 2px; } #rightSidebar { border: 1px solid red; width: 200px; height: 600px; background-color: black; position: fixed; margin-left: 800px; } |
|
|||
Zitat:
Bitte beantworte alle Fragen, die ich oben gestellt habe. Bisher ist nur die eine Frage "wo soll gescrollt werden" durch dein Beispiel beantwortet. Es soll also im Browserfenster gescrollt werden, nicht in einem Element selbst? Ganz wichtig: Setz Inhalte ein. Man kann ein Layout nicht mit ein paar leeren Boxen testen. Zitat:
Daher ist das gesamte Konzept äußerst fragwürdig. Wenn es nicht ausschließlich in einer kontrollierten Umgebung eingesetzt wird halte ich es für gänzlich untauglich. Du kannst dir mal dieses Beispiel von Stu Nicholls anschauen. Dort wird in Inhaltsbereichen selbst gescrollt, nicht im Browserfenster. Das ist nicht schön und nicht besonders benutzerfreundlich. Doch wenigstens sind die Inhalte (etwas besser) erreichbar. Zitat:
Dein Inhaltsbereich müsste nicht absolut positioniert sein.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
Stichwörter |
clear, css, fixed, float, resize, scroll |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
CSS tabelle wird im FF nicht zentriert dargestellt | neugierig_asdf | CSS | 2 | 08.02.2009 14:23 |
Positionierung einiger Elemente falsch | CrAzYs | CSS | 4 | 09.10.2008 21:45 |
3 Spalten, mitte fixed width und immer horizontal zentriert - realisierbar?! | vXel | CSS | 0 | 06.05.2008 00:33 |
Positionierte Tabelle - fixed, zentriert, vertikal zentriert | nick | CSS | 0 | 20.08.2006 03:33 |
Zweispaltenlayout - Zentriert + Position fixed | Mikronesien | CSS | 1 | 03.07.2006 23:23 |