[code]#menu{ width: 960px; height: 60px; background-color: #272727; position: fixed; } li{ list-style: none; display: inline; padding: 30px; margin-top: 20px; } li a:link, a:visited{ color: #cecece; text-decoration: none; font-family: ‘1’; font-size: 40px; } li a:hover, a:active{ color: #272727; background-color: #cecece; text-decoration: none; font-family: ‘1’; font-size: 40px; background-color: #cecece; } #header{ width: 960px; height: 299px; }
Są to oczywiście tylko wycinki kodu. Ale problem polega na tym, że div menu ustawiłem
position: fixed;
i gdy wklepie potem header zachowuje się on tak jak by menu wgl nie było. Tzn. Jest na samej górze strony i menu go zakrywa (część) i jak do headera dopisze w CSS3
margin-top: 60px;
to menu też się przesuwa. Zna ktoś na to jakiś sposób ?
A o jaki efekt chodzi? Chcesz by menu miało stałe miejsce na ekranie na samej górze i było widoczne zawsze, niezależnie od przewijania strony (to daje position: fixed;), a header chcesz przesunąć pod menu dla “zerowego” stanu przewinięcia?
Jeśli tak to daj te “margin-top: 60px;” dla html i/lub body, chyba że budowa strony jest inna (np. jak na screen’ie, gdzie wsio jest gdzieś po środku i nie skaluje się do szerokości przeglądarki), wtedy daj górny margines dla header’a, a zostanie “wypchnięty” spod menu… tak czy siak, w obu przypadkach dojdzie do przesunięcia w dół, w pierwszym całą stronę (prócz menu), w drugim nagłówek popchnie content pod nim zawarty (również prócz menu).