nicht angemeldet
fixe navigation
Grüezi Mitenand
Ich schreibe hier zum ersten mal in diesem Forum und hoffe ich habe das Thema mit "css" richtig gewählt.
Das Problem,das mich nun schon einige Tage beschäftigt ist,ich möchte auf einer Website,(zu sehen auf http://www.rsknoepfel.ch)ein fixes Navigations-Div.War bis jetzt auch keine grosse Sache,ausser im ie7,den bringe ich einfach nicht zufrieden.Dieser sollte ja fixed div's unterstüzen,tut es aber hier nicht.Wenn ich per css position fixed eingebe ist die Navigation gar nicht zu sehen,mit dem eingefügten "conditional comment für ie7" ist sie zwar zu sehen,aber dafür nicht fix.
Kennt von euch jemand dieses "Problem"? oder ist das ein Denkfehler meinerseits
Gruss Rolf
-
Hi,
Das Problem,das mich nun schon einige Tage beschäftigt ist,ich möchte auf einer Website,(zu sehen auf http://www.rsknoepfel.ch)ein fixes Navigations-Div.War bis jetzt auch keine grosse Sache,ausser im ie7,den bringe ich einfach nicht zufrieden.Dieser sollte ja fixed div's unterstüzen,tut es aber hier nicht.Wenn ich per css position fixed eingebe ist die Navigation gar nicht zu sehen,mit dem eingefügten "conditional comment für ie7" ist sie zwar zu sehen,aber dafür nicht fix.
Derzeit bindest du ueber Conditional Comments fuer IEs folgende zwei Stylesheets ein:
<!--[if gt IE 6]>
<link href="stylesheet/ie7.css" rel="stylesheet" type="text/css" />
<![endif]--><!--[if lt IE 7]>
<link href="stylesheet/ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->Diese sind beide inhaltlich identisch, und darin hast du folgendes stehen:
* html div#navigation {position: relative;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop : document.body.scrollTop);}Gut, das emuliert fixe Positionierung per JavaScript-Expression[1] fuer IE <= 6 - fuer den IE 7 wirkt der Star-html-Hack nicht mehr.
Dem IE 7 bleibt damit also nur noch,
#navigation {
position: relative;umzusetzen - dass da nix mit fixed is', sollte klar sein.
Btw:
* html,* html body{
background: #FFF8E4 url(denkste Pfeiffe) fixed;- das taet'sch lassen - damit bekommst du fuer jeden Aufruf einen 404 Not Found-Fehler im Log (ich nehme mal an, dass es keine Ressource mit diesem Namen gibt?). Wenn du den IE <= 6 kein Hintergrundbild geben willst, dann nutze lieber background-image:none.
[1] Es gibt uebrigens auch einen Workaround, der ohne JavaScript auskommt. Je nach Seitenaufbau manchmal nicht unproblematisch - insb., wenn fixierte Elemente ueber die ganze Breite gehen sollen, wird's mit den Scrollbalken-Maszen problematisch - aber vielleicht moechtest du ihn dir ja trotzdem mal anschauen.
MfG ChrisB
--
"The Internet: Technological marvel of marvels - but if you don't know *what* you're lookin' for on the Internet, it is nothing but a time-sucking vortex from hell."-
Hi,
Das Problem,das mich nun schon einige Tage beschäftigt ist,ich möchte auf einer Website,(zu sehen auf http://www.rsknoepfel.ch)ein fixes Navigations-Div.War bis jetzt auch keine grosse Sache,ausser im ie7,den bringe ich einfach nicht zufrieden.Dieser sollte ja fixed div's unterstüzen,tut es aber hier nicht.Wenn ich per css position fixed eingebe ist die Navigation gar nicht zu sehen,mit dem eingefügten "conditional comment für ie7" ist sie zwar zu sehen,aber dafür nicht fix.
Derzeit bindest du ueber Conditional Comments fuer IEs folgende zwei Stylesheets ein:
<!--[if gt IE 6]>
<link href="stylesheet/ie7.css" rel="stylesheet" type="text/css" />
<![endif]--><!--[if lt IE 7]>
<link href="stylesheet/ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->Diese sind beide inhaltlich identisch, und darin hast du folgendes stehen:
* html div#navigation {position: relative;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop : document.body.scrollTop);}Gut, das emuliert fixe Positionierung per JavaScript-Expression[1] fuer IE <= 6 - fuer den IE 7 wirkt der Star-html-Hack nicht mehr.
Dem IE 7 bleibt damit also nur noch,
#navigation {
position: relative;
umzusetzen - dass da nix mit fixed is', sollte klar sein.Btw:
* html,* html body{
background: #FFF8E4 url(denkste Pfeiffe) fixed;- das taet'sch lassen - damit bekommst du fuer jeden Aufruf einen 404 Not Found-Fehler im Log (ich nehme mal an, dass es keine Ressource mit diesem Namen gibt?). Wenn du den IE <= 6 kein Hintergrundbild geben willst, dann nutze lieber background-image:none.
[1] Es gibt uebrigens auch einen Workaround, der ohne JavaScript auskommt. Je nach Seitenaufbau manchmal nicht unproblematisch - insb., wenn fixierte Elemente ueber die ganze Breite gehen sollen, wird's mit den Scrollbalken-Maszen problematisch - aber vielleicht moechtest du ihn dir ja trotzdem mal anschauen.
MfG ChrisB
Danke für die Antwort Chris
Dem Conditional Comment für ie6 habe ich nun ein Background-Gif mitgegeben, ohne flackert die Navigation beim scrollen.
Den Conditional Comment für ie7 habe ich entfernt und ie7 sieht nun wieder das Standart-CSS. Aber eben, jetzt zeigt er mir wieder überhaupt kein Navi an. Seit Tagen sitze ich nun vor Google und versuche herauszufinden, was ich im CSS wohl falsch geschrieben habe.
Der Tipp mit dem Workaround ist gut, den werde ich mir genauer ansehen.
Gruss Rolf
-
Hi,
bitte zitiere sinnvoll, und nicht einfach "alles"!
Den Conditional Comment für ie7 habe ich entfernt und ie7 sieht nun wieder das Standart-CSS. Aber eben, jetzt zeigt er mir wieder überhaupt kein Navi an.
Die IE Developer Toolbar zeigt mir an Styles fuer #navigation nur position:fixed an, ohne jegliche "Koordinaten"-Angabe (top, left, ...) - das vertraegt der IE m.W. nicht.
(Und absolute/fixe Positionierung mit float zu kombinieren, ist auch unsinnig - float erhaelt dann implizit den Wert none, siehe auch Relationships between 'display', 'position', and 'float'.)MfG ChrisB
--
"The Internet: Technological marvel of marvels - but if you don't know *what* you're lookin' for on the Internet, it is nothing but a time-sucking vortex from hell."-
Hi,
bitte zitiere sinnvoll, und nicht einfach "alles"!
Den Conditional Comment für ie7 habe ich entfernt und ie7 sieht nun wieder das Standart-CSS. Aber eben, jetzt zeigt er mir wieder überhaupt kein Navi an.
Die IE Developer Toolbar zeigt mir an Styles fuer #navigation nur position:fixed an, ohne jegliche "Koordinaten"-Angabe (top, left, ...) - das vertraegt der IE m.W. nicht.
(Und absolute/fixe Positionierung mit float zu kombinieren, ist auch unsinnig - float erhaelt dann implizit den Wert none, siehe auch Relationships between 'display', 'position', and 'float'.)MfG ChrisB
Problem gelöst!
Die Idee mit dem "unsinnigen" float das Chris angesprochen hat, brachte
mich schlussendlich auf die Lösung, obwohl nicht der float selber das Problem war.
Wenn ich die Navigation aus dem Wrapper nahm und gleich zu Anfang in den Body
setzte, war sie zwar auch im ie7 zu sehen, machte mir aber sorgen mit der
Positionierung.
»»Ich habe nun ein weiteres Div in den Wrapper gesetzt und an der Stelle positioniert, an die die Navigation sollte. Darin befindet sich jetzt die Navi mit Position fixed und plötzlich findet auch der ie7 alles sei in Ordnung.
Ob das nun gut ist oder nicht bleibt für mich offen, aber ich kann nun endlich die Arbeit fertig machen und die "Kundschaft" wird mir nicht mehr jeden Tag im Nacken sitzen.
PS. Kann mir jemand noch das mit den zitierten Zeichen erklären, damit ich das beim nächsten Mal auch richtig machen kann?
»»
Danke für Euere Hilfe, Gruss Rolf
-
-
Hallo,
[1] Es gibt uebrigens auch einen Workaround, der ohne JavaScript auskommt.
Dazu noch ergänzend einen Verweis auf Position Fixed für alle Browser per CSS
sowie auf eine u.U. einfachere Alternative position fixed für Internet Explorer 6.Grüsse
Cyx23