CSS Tło jako fixed

0

Witam,

Link do szablonu: http://partnergsm.pl/szablon_allegro/index.html

Tworze szablon na allegro. Chciałbym uzyskać efekt taki jak na www.patrykszczygiel.pl. Chodzi mi o tło które jest zawsze stałe i domyślam się że to dzieki "position:fixed". Jednak próbuje i nic mi z tego nie wychodzi.

Po drugie chciałbym mieć dwa główne divy z tekstem. Jeden to "opis przedmiotu" (najwiekszy box) oraz zaraz obok "płatności", pic polega na tym aby box "płatności" wydłużał się zaleznie od boxu opis przedmiotu. W tej chwili box robi to co powinien, jednak tekst zamiast być obok, to jest pod tekstem z boxu obok.

Mam nadzieje że nie będziecie mieli problemu ze zrozumieniem kodu.
Pozdrawiam i mam nadzieje ze mi pomożecie.

0
Partnergsm napisał(a)

Tworze szablon na allegro. Chciałbym uzyskać efekt taki jak na www.patrykszczygiel.pl. Chodzi mi o tło które jest zawsze stałe i domyślam się że to dzieki "position:fixed". Jednak próbuje i nic mi z tego nie wychodzi.
Nie position a background-position.

0

Uzyłem tego, oraz dodałem opcje no-repeat. I dupa. Tło jest w jednej pozycji cały czas. Ja chciałbym tak jak na patrykszczygiel.pl Gdzie tło się nie przesuwa tylko wlaściwa część strony.

#calosc{
color:white;
background-position: fixed;
background:url('img/tlo.jpg');
width:1000px;
background-repeat: no-repeat;
margin: 0 auto;
}

0

Sory, pomyliło mi się, właściwość nazywa się backround-attachment, background-position jest odpowiedzialne za co innego.

AKTUALIZACJA
Poza tym robisz i tak źle. Właściwość background jest odpowiedzialna za wszystkie właściwości tła, używaj albo samego background (np. background: url(../img/bg.gif) fixed;), albo definiuj wszystko osobno (background-image, background-position, background-color itd.).

0

Dzieki. Działa perfekcyjnie. Pozostaje tylko sprawa boxu płatności, aby sie wydłużał względem głównego boxu. Nie mam pojęcia jak to zrobić, bo kazda proba kończy się rozjazdem całej strony

0

Witam.
Zacząłem kończyć szablon i własnie ta funkcja mi się popsuła. Od paru godzin siedze i probuje i nie mam pojecia co jest grane. Juz nie mam sily. Załączam kod szablonu:
<html>

<head> <title>Szablon allegro</title> <style> #calosc{ color:white; width:1000px; margin: 0 auto; background-image:url('http://partnergsm.pl/szablon_allegro/img/tlo.jpg'); background-attachment: fixed; background-repeat: no-repeat; background-position: top center; height:1000px; } #baner{ width:625px; height:282px; background: url('http://partnergsm.pl/szablon_allegro/img/baner2.png'); float:left; margin-top:60px; } #header{ width:318px; height:281px; background:url('http://partnergsm.pl/szablon_allegro/img/nawigacja.png'); margin-top:60px; margin-left:12px; float:left; margin-bottom:40px; } #button1 a:link { text-decoration:none; color:black;} #button1 a:visited { text-decoration:none;color:black;} #button1 a:hover { text-decoration:none; color:black;} #button1 a:active { text-decoration:none; color:black;} #button1{ text-align: justify; margin-top:35px; margin-left:65px; font-weight: bold; color:black; font-family: “Myriad Pro”; font-style: styl } #button2{ text-align: justify; margin-top:20px; margin-left:100px; font-weight: bold; font-family: “Myriad Pro”; } #button3{ text-align: justify; margin-top:20px; margin-left:100px; font-weight: bold; font-family: “Myriad Pro”; } #button4{ text-align: justify; margin-top:20px; margin-left:70px; font-weight: bold; font-family: “Myriad Pro”; } #button5{ text-align: justify; margin-top:20px; margin-left:120px; font-weight: bold; font-family: “Myriad Pro”; } #button6{ text-align: justify; margin-top:20px; margin-left:95px; font-weight: bold; font-family: “Myriad Pro”; } #poczatektekst{ background:url('http://partnergsm.pl/szablon_allegro/img/poczatekopis.png'); width:673px; height:81px; } #koniectekst{ background:url('http://partnergsm.pl/szablon_allegro/img/koniectekst.png'); width:673px; height:25px; clear:both; } #tresc{ background: url('http://partnergsm.pl/szablon_allegro/img/srodekopis.png') repeat-y; width:673px; padding:20px 50px 20px 40px; } #tresc .tresc{ padding-left:40px; padding-top:20px; } #poczatekinfo{ background:url('http://partnergsm.pl/szablon_allegro/img/gorakontaktplatnosci.png'); width:322px; height:80px; } #koniecinfo{ background:url('http://partnergsm.pl/szablon_allegro/img/konieckontaktplatnosci.png'); width:322px; height:37px; clear:both; } #info{ background: url('http://partnergsm.pl/szablon_allegro/img/srodekkontaktplatnosci.png') repeat-y; width:322px; padding:20px 70px 20px 45px; } #lewo{ float:left; width:673px; } #prawo{ float:right; width:327px; } #kontakt{ background:url('http://partnergsm.pl/szablon_allegro/img/mail.png'); width:73px; height:73px; } #omnie{ background:url('http://partnergsm.pl/szablon_allegro/img/omnie.png'); width:73px; height:73px; } #platnosc{ background:url('http://partnergsm.pl/szablon_allegro/img/omnie.png'); width:73px; height:73px; } #regulamin{ background:url('http://partnergsm.pl/szablon_allegro/img/regulamin.png'); width:73px; height:73px; } #gwarancja{ background:url('http://partnergsm.pl/szablon_allegro/img/gwarancja.png'); width:73px; height:73px; } #przebieg{ background:url('http://partnergsm.pl/szablon_allegro/img/przebieg.png'); width:73px; height:73px; } #wysylka{ background:url('http://partnergsm.pl/szablon_allegro/img/wysylka.png'); width:73px; height:73px; } p{ margin-left:85px; margin-top:50px; } #tresc .stopka{ } #clear{ both:clear; } a:link { text-decoration:none; color:white;} a:visited { text-decoration:none;color:white;} a:hover { text-decoration:none; color:white;} a:active { text-decoration:none; color:white;} </style> </head> <body>
sadasdadsadsadsadais abdiubdiudbdsai bdsaiubdbsadi sabdisabdsa ibdasibdsaiubdsaib dsaibdsaiudba sadaiubdiusabdaiusbdsad saosaindisabdsa dsabduasbdiusabdiusabdiusabdiusabd sadbsauidbsaiudbsaiubdasd

blablabla


blablabla


blablabla


blablabla


blablabla


blablabla


blablabla


</body>

</html>



Szablon wrzucony na serwer: http://partnergsm.pl/szablon_allegro/index.html

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0