Witam

Mam pewną zagwozdkę z którą nie mogę się uporać. Pobieram z bazy danych linki do obrazków. Chcę je teraz wyświetlić na stronie, ale w taki sposób, aby były po 4 w linijce. Robię więc to na listach (poniżej przykład):

[HTML] pobierz, plaintext 
<ul>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<ul />
[HTML] pobierz, plaintext 

A w CSS oczywiście jest jako inline. Teraz aby wyświetlić 2 rząd to robię kolejną listę.

W jaki sposób to zautomatyzować, aby po wielokrotności 4 elementu robiło nową listę? Czy dość poprawnie będzie zrobienie czegoś takiego:

[HTML] pobierz, plaintext 
<ul>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<br />
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
</ul>
[HTML] pobierz, plaintext 

i po 4 elemencie wstawiać br ?

Kompletnie nie mam pomysłu jak to ugryźć :/

http://nospor.pl/co-trzy-wyswietlanie-danych.html

A rozmiary obrazków są takie same? Czy każde li musi mieć takie samo width? Bo najprostszym rozwiązaniem jest


i wtedy masz co 4 punkty listy nową linię zautomatyzowaną przez CSS.

A nie lepiej div o takiej szerokości, żeby się tylko 4 mieściły? albo w pętli odliczać do 4 i wstawiać </ul><ul>?

Albo podzielić tablicę z danymi na kawałki po 4 szt.

Dziękuję za odpowiedzi Są bardzo pomocne, ale nad wybraniem rozwiązania muszę się jeszcze zastanowić

Ale po co jeszcze zbędny div wstawiać, skoro można ograniczyć blok już w <ul>? Trochę bez sensowne pisanie kodu.

Miałam na myśli divy zamiast ul/li a jeśli to mają być same zdjęcia, bez tytułów i innych dodatków to porostu same zdjęcia z float left i tak ustawionymi marginesami, żeby się mieściły tylko 4 w linii.

[PHP] pobierz, plaintext 
 
$k = 1;
$write = '<ul>';
 
while($row = mysql_fetch_array($select)) {
 
	$write .= '<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>';
 
	if($k%4==1) {
 
		$write .= '</ul><ul>';
	}
$k++;
}
 
$write .= '</ul>'
 
echo $write;
[PHP] pobierz, plaintext