Ustawienie grafiki poza ramą strony www

[essenemari]

Witam kolegów

Od dłuższego czasu chciałem zrobić coś takiego żeby, opisowo mówiąc, grafika wychodziła poza ramy strony. Idea mniej więcej wygląda jak tu. Dzisiaj w nocy siedziałem nad banerkiem i przedłużyłem sobie smugi w zakresie banera jak jest tutaj teraz będę myślał żeby te smugi (przedłużyć) wrzucić w jakiś sposób na background'a tak żeby zawsze trzymały się strony we wszystkich rozdzielczościach (po prostu żeby się nie rozjeżdżało). Próbowałem prostych metod ustawiania tych elementów graficznych, ale zawsze mi się dziadostwo rozjeżdżało na wsze strony. Znacie może jakiś sposób żeby nie trzeba było przebudowywać całego css i strony ?:>

Bardzo prosiłbym o jakieś wskazówki jak przyczepić (dowolną) grafikę do ramy strony przy pomocy css, bo z estetycznym aspektem sobie poradzę. Jeżeli rozwiązanie problemu jest banalne i uraziłem kogoś tym pytaniem to bardzo przepraszam

Pozdrawiam i dziękuję.

[zielony_gremlinek]

dla diva z obrazkiem (tym Twoim logo) ustawiasz w css position:absolute i wartości dla left i top a dla diva w którym jest cała strona posiotion:relative i wtedy możesz tego diva z logo przesuwać jak Ci się podoba.

Np by wystawał ponad główną stronę z lewej to wystarczy dodatkowo ustawić np left:-30px i top:-30px i wtedy jest wysunięty poza główne pole div o 30px.

[essenemari]

dla diva z obrazkiem (tym Twoim logo) ustawiasz w css position:absolute i wartości dla left i top a dla diva w którym jest cała strona posiotion:relative i wtedy możesz tego diva z logo przesuwać jak Ci się podoba.

Np by wystawał ponad główną stronę z lewej to wystarczy dodatkowo ustawić np left:-30px i top:-30px i wtedy jest wysunięty poza główne pole div o 30px.

Tak też zrobiłem. To logo debiana specjalnie testowo podzieliłem na 3 części składowe żeby doświadczalnie przekonać się jak się grafiki będą zachowywać przy zmianach rozdzielczości. Niestety przy zmianach rozdzielczości nic się nie trzymało całości. Składowe obrazka oddaliły się od banera i od siebie (są na position:absolute), a strona delikatnie uciekła do środka, żeby "przystosować" się do nowej (większej) rozdzielczości. Dlatego zastanawiam się jak to zrobić żeby "scalić" grafikę ze strony (tutaj smugi z banera) z grafiką z poza strony (przedłużenie tych smug) tak żeby zawsze trzymały się razem. Możliwa jest taka operacja według Was, gdy strona już jest zbudowana?

[zielony_gremlinek]

zapomniałem dopisać, że jak pozycjonujesz diva, to muszą też być ustawione w pixelach wysokość i szerokość diva, masz tak ?

[essenemari]

zapomniałem dopisać, że jak pozycjonujesz diva, to muszą też być ustawione w pixelach wysokość i szerokość diva, masz tak ?

Tak, tak, parametry diva też ustalałem w taki sposób

#test1	{
position: absolute;
width: 25px;
height: 82px;
	background: white url(bok.jpg) no-repeat;
padding: 0;
margin: 0;
top: 10px; left: 2px;	
}

#test2	{
position: absolute;
width: 121px;
height: 36px;
	background: white url(gora.jpg) no-repeat;
padding: 0;
margin: 0;
top: 0px; left: 50px;	
}

i tutaj jest rozdzielczość niższa, tutaj wyższa i chodzi o dystans między obrazkami a stroną, który właśnie chciałbym zniwelować.

[zielony_gremlinek]

w złym miejscu umieściłeś diva z logo, jest pewno bezpośrednio w body więc pozycjonuje się względem body, czyli ustawiłeś odległość od krawędzi ekranu, a nie strony wyśrodkowanej, wrzuć diva z logo do diva ze stroną i tam ustaw ujemną odległość od lewej i od góry, wtedy będzie pozycjonowane na każdej rozdzielczości względem strony, a nie krawędzi ekranu.

Pamiętaj też, że div ze stroną ma mieć position:relative

Tak musi działać!

[essenemari]

Działa!!

Bardzo dziękuję za podpowiedzi aż jestem ciekaw jak to będzie wyglądało jak poustawiam sobie te smugi

jeszcze raz stokrotne dzięki

Pozdrawiam gorąco

[zielony_gremlinek]

Super! Powodzenia w tworzeniu

[essenemari]

Ostateczny wygląd stronki wypadł mniej więcej tak No ale problemik pojawia się odwieczny dopasowania do przeglądarek. W FF, Opera, Chrome jest w miarę równo dopasowane (nie widać znaczących różnic na łączeniach), a w IE wszelkiej maści wygląda to fatalnie... Jakieś przesunięcie się zrobiło... :] ale... trochę kosmetyki powinno pomóc:)