Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML] Duzy obrazek w footerze
Forum PHP.pl > Forum > Przedszkole
-Adam-
Witam, mam coś takiego: http://naven.com.pl/test/

Jak widać w headerze jest duży obrazek i tak ma być, jednak, chcę zrobić to samo z footerem (http://naven.com.pl/test/rammstein_footer.jpg). Szukałem dość po necie, ale praktycznie nic nie chce działać, albo nie do końca o to mi chodzi. Obrazek ma pozostawać na swoim miejscu bez względu na przesuwanie strony, tak samo jak header.
Obecnie wygląda to tak:
  1. #footer_img{
  2. background: url("rammstein_footer.jpg") 50% 100% no-repeat;
  3. height: 731px;
  4. width: 1300px;
  5. margin-left: auto;
  6. margin-right: auto;
  7. }

Efektem jest, że obrazek jest na środku strony. Gdy dam
background: url("rammstein_footer.jpg") 50% 100% no-repeat bottom center;
Obrazek nie wyświetla się w ogóle.
Czy wiecie jak to rozwiązać?
Damonsson
Ja tam bym to (górne i dolne tło) wrzucił w body i dał multiple-background.
-Adam-
Czy miałeś na myśli coś takiego?
  1. body {
  2. width: 500px;
  3. height: 250px;
  4. background: url("slipknot_background.jpg"), url("rammstein_footer");
  5. background-position: center top, center bottom;
  6. background-repeat: no-repeat;
  7. }



Nie do końca działa, wyświetla mi tylko jeden obrazek, znalazłem tu http://www.css3.info/preview/multiple-backgrounds/
-Adam-
Zauważyłem swój błąd dopiero w poście. Poprawiłem i działa, ale to nie jest efekt który chciałem osiągnąć, nie do końca.
  1. body {
  2. background: url("slipknot_background.jpg"), url("rammstein_footer.jpg");
  3. background-color: #010101;
  4. background-position: center top, center bottom;
  5. background-repeat: no-repeat;
  6. width: 1300px;
  7. height: -200px;
  8. margin-left: auto;
  9. margin-right: auto;
  10. color: #c8deb9;
  11. }


Potrzebuję jeszcze, aby tło wychodziło trochę poza stronę, tak samo jak header zaczyna się przed treścią strony, tak samo strona ma się kończyć chwilę przed końcem footera.
Damonsson
Nie analizowałem kodu, ale padding-bottom powinien załatwić sprawę. Jak nie chcesz używać dla body, to zawsze możesz sobie stworzyć kontener.
Gość
Działa, dziękuję ci za pomoc.

Jeszcze jedna sprawa. Przeklikałem sobie korzystając z kilku przeglądarek i w operze najnowszej czasami menu przesuwa się trochę niżej, po odświeżeniu jest w porządku. Czym może to być spowodowane? W chrome i firefoxie nie zauważyłem, żeby się działo coś takiego.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.