Note that there are some explanatory texts on larger screens.

plurals
  1. POPHP random DIV question
    text
    copied!<p>I am tried to use PHP to make DIV random positions. Here is my code. </p> <pre><code>&lt;?php function DIV1() { $choose = array("left", "right"); $rand_keys = array_rand($choose, 1); echo "&lt;div class=position1 style=\"float:left;width:100px;height:100px;background-color:#00f;float:".$choose[$rand_keys].";border:1px solid #000;\"&gt;&lt;/div&gt;"; } function DIV2() { $choose = array("left", "right"); $rand_keys = array_rand($choose, 1); echo "&lt;div class=position2 style=\"float:left;width:100px;height:200px;background-color:#f00;float:".$choose[$rand_keys].";border:1px solid #000;\"&gt;&lt;/div&gt;"; } function DIV3() { $choose = array("left", "right"); $rand_keys = array_rand($choose, 1); echo "&lt;div class=position3 style=\"float:left;width:200px;height:100px;background-color:#ff0;float:".$choose[$rand_keys].";border:1px solid #000;\"&gt;&lt;/div&gt;"; } echo '&lt;div id="display" style="width:1016px;height:1016px;background-color:#333;"&gt;'; $count = Math.floor(rand()*25) +15; for ($i=0; $i&lt;$count; $i++) { echo DIV1(); echo DIV2(); echo DIV3(); } echo '&lt;/div&gt;'; ?&gt; </code></pre> <p>My code can mixed divs position. But I have 2 questions. </p> <ol> <li><p>How to control <code>15 pieces 100*100</code>, <code>10 pieces 100*200</code>, <code>5 pieces 200*100</code> divs mixed random display? </p></li> <li><p>How to control the white space part? I want show all the divs in the display zone. <code>width:1016px;height:1016px;</code>, do not out of the <code>div#display</code>.</p></li> </ol>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload