Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>The title of the document</title> <style> #example { width: 220px; height: 300px; padding: 0; border: 1px solid #000; display: -webkit-flex; /* Safari */ -webkit-align-items: flex-start; /* Safari 7.0+ */ display: flex; align-items: flex-start; } #example li { -webkit-flex: 1; /* Safari 6.1+ */ flex: 1; list-style: none; } </style> </head> <body> <h2>Align-items: flex-start; example</h2> <ul id="example"> <li style="background-color:#8ebf42;">Green</li> <li style="background-color:#1c87c9;">Blue</li> <li style="background-color:#ccc;">Gray</li> </ul> </body> </html>