div który sam zmienia wysokość

0

Problematyka jest taka, że muszę użyć trzech obrazków w tym div'ie.
Jeden na górze (niepowtarzalny), jeden niżej (powtarzalny) i jeszcze jeden na samym dole (niepowtarzalny). Treść musi zaczynać się na pierwszym i kończyć na trzecim z czego drugi obrazek się powtarza w zależności od długości treści. Kombinuje i kombinuje, ustawiam trzy divy jeden w drugi, ale mi nie wychodzi zamierzony efekt. Prosiłbym o nakierowanie na rozwiązanie.

0

Powinno wychodzić, jeżeli nie wychodzi - to nie bardzo wiem co chcesz zrobić i jak to robisz.
Pokaż swoje 3 obrazki i kod jakim próbujesz rozwiązać problem.

0

Dobra udało się w css 3, ale jak ktoś ma pomysł jak to zrobić tak, żeby działało w starszych przeglądarkach to chętnie posłucham.

<div id="content" style="min-height:600px;width:520px;background: url('up.jpg') no-repeat top, url('down.jpg') no-repeat bottom, url('middle.jpg') repeat center;">
	sssssss
	</div>
0

Ja chętnie zobaczę jak Ci nie wyszło, bo pomysł miałeś dobry. Pokaż kod + obrazki - pomogę. Nie - czekaj na kogoś z magiczną kulą.

0

Nie wiem czy dobrze rozumiem o co Ci chodzi ale ja zrobiłbym to tak:
stworzył jednego dużego diva "opakowującego" i w nim ustalił dopasowujące się tło (czyli to jak gdyby zastąpiło drugi div), i na tym warstwa, gdzie górny i dolny div wyrównane relatywnie do top i bottom.
Aczkolwiek zaznaczam, nie wiem czy dobrze zrozumiałem Twój problem ;)

0

Dobra dzek, dzisaj po południo wstawie laya i kod jakim próbowałem to zrobić wcześniej, bo teraz idę spać.

0

W końcu.
Tak, dobrym pomysłem jest 3 divy jeden w drugim, bo bez CSS3 inaczej tego nie uzyskasz.

0

kod:

<div style="position:absolute;top:50px;left:100px;min-height:600px;width:520px;">
	<div style="min-height:289px;width:520px;background: url('up.jpg') no-repeat top">
		<div style="min-height:95px;width:520px;background: url('down.jpg') no-repeat bottom">
			<div style="min-height:200px;width:520px;background: url('middle.jpg') repeat center">
				ssssssssss
			</div>
		</div>
	</div>
</div>

Wyświetla się tylko powtarzany middle.jpg.

Obrazki (pocięte krzywo, bo tylko do testów):
http://imageshack.us/g/706/upsv.jpg/

2

mniej więcej widzę po kodzie.
min-height ustaw tylko dla najgłębszego diva.
i obrazki ustawiaj odwrotnie - najpierw powtarzający się, potem dolny, potem górny - ten "najgłębiej" jest zawsze na wierzchu.
Ale to Ci się nie będzie idealnie powtarzać, tego się chyba spodziewasz? Patrząc na obrazki to zapewne one będą pasować "idealnie" tylko jeżeli wysokość tego wszystkiego będzie wielokrotnością powtarzającego się tła dodanej do wysokości części górnej i dolnej. To możesz sobie poprawić javascriptem, chyba, żeby dało się ustawić "gradient" kanału alpha na obrazkach na dole i górze (tylko ciężko mi to stwierdzić po tych dziwnych obrazkach)

0

Pisałem, że to testowo pocięte, ten powtarzający się nie będzie zmieniał w pionie, będzie mógł nawet mieć 1px wysokości, więc będą pasować idealnie.

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