I want to display these 4 player wrapper divs as in a grid. I.e.
---------- ----------
|player 1| |player 2|
---------- ----------
---------- ----------
|player 3| |player 4|
---------- ----------
I want to display these 4 player wrapper divs as in a grid. I.e.
---------- ----------
|player 1| |player 2|
---------- ----------
---------- ----------
|player 3| |player 4|
---------- ----------
| ul.players { | |
| overflow: hidden; | |
| list-style: none; | |
| width: 400px; | |
| } | |
| ul.players li { | |
| float: left; | |
| width: 200px; | |
| height: 200px; | |
| } |
| <!DOCTYPE HTML> | |
| <html> | |
| <body> | |
| <ul class="players"> | |
| <li class="player_wrapper"> | |
| <form><select></select></form> | |
| <div class="player"><video></video></div> | |
| </li> | |
| <li class="player_wrapper"> | |
| <form><select></select></form> | |
| <div class="player"><video></video></div> | |
| </li> | |
| <li class="player_wrapper"> | |
| <form><select></select></form> | |
| <div class="player"><video></video></div> | |
| </li> | |
| <li class="player_wrapper"> | |
| <form><select></select></form> | |
| <div class="player"><video></video></div> | |
| </li> | |
| </ul> | |
| </body> | |
| </html> |