Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <style> .main { display: flex; width: 90%; height: 150px; background: #c3c3c3; } .main div { width: 20%; height: 90px; } div.item-blue { order: 2; } div.item-yellow { order: 4; } div.item-red { order: 3; } div.item-green { order: 1; } /* Changez les nombres pour voir comment les éléments sont enregistrés*/ </style> </head> <body> <h1>La propriété order</h1> <div class="main"> <div style="background-color:#1c87c9;" class="item-blue"></div> <div style="background-color:yellow;" class="item-yellow"></div> <div style="background-color:red;" class="item-red"></div> <div style="background-color:#8ebf42;" class="item-green"></div> </div> </body> </html>