Как сделать этот цикл один раз, перерыв, а затем продолжить цикл?

Question

Я зацикливаю div по горизонтали с поплавком: слева, и он работает так, как должен, но проблема заключается в том, что каждый div имеет уникальную высоту, на которую влияет содержимое, содержащееся внутри, поэтому результат может быть беспорядочным, если браузер повторно размер. Я хотел бы, чтобы php зациклился один раз, сломал, а затем запустил новую строку, чтобы она выглядела одинаково независимо от размера браузера.

Если это еще не очевидно, я плохо разбираюсь в php и изо всех сил пытаюсь собрать вместе то, что у меня есть.

<?php 
$url = "XML.php"; 
$xml = simplexml_load_file($url); 
$namespaces = $xml->getNamespaces(true); // get namespaces 
for($i = 0; $i < 10; $i++){ 

    $poster = $xml->channel->item[$i]->children($namespaces['x'])->poster; 
    $html .= "<div class='wrapper' style='float:left;'>$poster</div>";} 

echo $html; 
?> 

Answer 1

Если я понимаю, что вы хотите с информацией у меня есть вот что я предлагаю:

Ваш цикл нормально. Поэтому давайте скажем, что вы хотите, чтобы он выглядел одинаково без размера страницы. Например: вам нужно 5 div на каждую строку. Вы можете использовать css для этого.

У вас есть в общей сложности 10 div, поэтому вам понадобится 2 ряда.

добавить к вашей петле:

if($i = 5){ 
$html .= "<div class='wrapper' style='float:left;clear:right;'>$poster</div>";} 
} 
else{ 
$html .= "<div class='wrapper' style='float:left'>$poster</div>";} 
} 

Это очень простой, оператор clear:right; CSS будет препятствовать любой другой DIV идти справа от пятого DIV так он начнет новую строку;

Возможно, вы должны добавить display:inline-block; в свой css.

Если это разве работает так, как вы хотите, Иной вариант будет тем сделать каждую строку внутри DIV с теми же родами, если условие

Exemple:

html.= '<div class="row">'; // start the row here 
if($i = 5){ 
// You might want to use another increment to keep track of the row 
// because in this case you would only make 2 rows. 
    $html .= '</div><div class="row">'; // end the first row and start a new one 
    } 
    else{ 
    // we do nothing 
    } 
html.= '</div>'; //end the row here 

вы можете использовать второе приращение, которое прыгает на пять, поэтому с небольшим количеством мата вы можете сделать что-то вроде

После этого вам просто нужно настроить класс строк CSS.