Zmienna szerokość kolumny - dostosowanie zawartości

0

Witam,

Mój problem: Koduję w xhtml/css stronę dla klienta. Szerokość strony to 80%, więc dostosowuje się ona do rozdzielczości monitora. Składa się (w dużym uproszczeniu) z dwóch kolumn - jedna o stałej szerokości podanej w px, druga - ta ruchoma - nie ma podanej w css szerokości, dostosowuje się. W tej ruchomej kolumnie mam umieścić kilka małych obrazków - w kilku kolumnach i rzędach. Tutaj zaczynają się schody- jak to zakodować, żeby na coraz mniejszym monitorze obrazki, które nie mieszczą się w jednym rzędzie, "schodziły" do drugiego etc? Przy założeniu, że całość ma wyglądać estetycznie, więc przy każdej rozdzielczości przerwy między obrazkami mają być proporcjonalne. Póki co udaje mi się w ten sposób, że obrazki pływają do lewej, kiedy się nie mieszczą - robi się jeden rząd mniej, ale zmienia się margines zewnętrzny. Generalnie moja metoda żonglowania cssem nie daje efektów.
Nie oczekuję gotowego kodu, tylko pomocy - gdzie szukać? Czy za efekt, jaki chcę osiągnąć, jest odpowiedzialny jakiś skrypt? Spędziłem godziny googlając, i bez rezultatu. Mam małe doświadczenie w programowaniu, jestem grafikiem.Czy mój problem to sprawa stricte programistyczna, i powinienem zostawić to klientowi (programiście) do oprogramowania? Czy może jest na to gotowy skrypt, który wystarczy podłączyć - tylko jak go szukać??

Będę wdzięczny za pomoc.

Birbag

0

Używanie skryptów do zrobienia layoutu jest raczej dziwne i najlepiej tego unikać. Nie do końca rozumiem, co Ci nie pasuje w tej metodzie z floatami? Generalnie tak to się robi. Obrazki kodujesz w HTML-u jako listę ul z wieloma li. W każdym elemencie li wstawiasz obrazek. Potem dajesz li float: left. Efekt jest taki, że w jednym wierszu jest tyle obrazków (o stałej szerokości), ile się zmieści. Odstępy robisz marginesami, mogą one być procentowe.

Taki projekt był szczegółowo opisany w książce "CSS według Erica Meyera. Kolejna odsłona." Możesz sobie zerknąć do wersji online, o tu: http://more.ericmeyeroncss.com/projects/02/. Jeśli o to Ci chodzi, to masz tam pliki do ściągnięcia.

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