ordinare elementi estratti con foreach

mi chedevo come si potesse ordinare gli elementi estratti con un ciclo foreach ...
per esempio :

Codice PHP:

---

<?php


$i = 1;
foreach ($friends["data"] as $value) {


echo '<img src="https://example.com/' . $value["id"] . '/immagine"/>';

if ($i == 15) {
break;
}
$i++;
}

?>

---

così facendo vengono estratte delle immagini (15) una sotto laltra...ma come farei a ordinarle in file da 5 una sotto l'altra?
con una tabella? ma mi fareste un esempio perchè non riesco ad arrivare a far funzionare il codice...

Potresti semplicemente agire via css.

Per le immagini, "normalmente" a me le lascia allineate.. e non le estrae "una sotto l'altra".

Invece, ad esempio i div li estrae "uno sotto l'altro". Per i div, potresti fare:

Codice PHP:

---

$i = 1;
foreach ($friends["data"] as $value) {


echo ' <div '.(($i % 5 != 0)?'style=float:left;"':'').'>contenuto</div>';

if ($i == 15) {
break;
}
$i++;
}


---

Ciao!

no , a me le immagini (con quel codice che ho linkato) le estrae una sotto l'altra...
forse dovrei dire che le immagini le printo all'interno di un div ... ma non mi sembra influente

La domanda non è inerente al PHP, il foglio di stile (CSS) è responsabile per l'aspetto grafico, dunque per il posizionamento degli elementi nella pagina.

Non ho capito però se vuoi che le immagini vengano disposte in ordine da sinistra a destra (cinque in tutto per riga) o se debbano riempire prima la prima colonna, poi la seconda, e cosi via.
Per intenderci:

Codice:

---

1 2 3 4 5
6 7 8

---

oppure

Codice:

---

1 3 5 7 8
2 4 6

---

Inoltre, se le immagini differiscono per grandezza, come devono venire sistemate?

grazie, dovrebbero venire sistemate secondo il tuo primo schema..da sinistra verso destra : 5 e poi a capo.
Per la seconda precisazione: non servirà ridimensionare niente, dato che le immagini estratte avranno tutte la medesima dimensione.

E per quanto riguarda la disposizione delle immagini lungo la riga? Devono essere posizionate come i caratteri in una riga di testo? E all'interno della medesima riga, come devono venire allineate verticalmente? Le vuoi separate o appiccate? Specifica il maggior numero di dettagli possibili.

sì , chiedo scusa.
Dovrebbero essere come i caratteri in una riga, separate tra loro di poco (circa mezzo centimetro) e "una sotto l'altra" ordinatamente.
grazie

Non hai risposto in merito all'allineamento verticale: le immagini di diverse altezze della medesima riga come dovrebbero essere allineate? Con il bordo inferiore in comune o quello superiore o il centro? Infine, per poterti dare direttamente le regole CSS è necessario sapere il selettore (o altre informazioni, come id o nome dell'elemento) che identifica in modo univoco l'elemento contenitore di tutte queste immagini.

avevo risposto in merito alle diverse altezze delle immagini dicendo che sono tutte della medesima altezza e larghezza ...l'elemento contenitore invece è il div con id="right-container"
grazie

Ops, vero, scusa, mi è sfuggito.
Prova così:

Codice:

---

#right-container img{
        float: left;
        margin-right: 4em;/*Lascia a destra uno spazio pari a quattro volte la grandezza del testo*/
}

#right-container img:nth-child(5n+1){
        clear: left;
}

---

ringrazio per la risposta..
però non mi funziona..ho il div (right-container) che al suo interno ha le immagini che vengono printate grazie al foreach.
però le immagini continuano a essere "una sotto l'altra" sebbene io abbia aggiunto lo script che mi hai gentilmente preparato
Dovrei forse aggiungere un id anche alle immagini?