HTML and CSS Reference
In-Depth Information
Setting the flex property alone greatly improves the layout, as Figure 22-34 shows.
But the <article > elements need to be converted into flex containers as well. Their
contents need to be displayed as columns, so add the following definitions to their
style rule:
article {
background-color: #FFF;
margin: 5px;
border-radius: 15px;
padding: 10px;
font-size: 14px;
-webkit-flex: 1 1 0;
display: -webkit-flex;
-webkit-flex-flow: column;
flex: 1 1 0;
display: flex;
flex-flow: column;
Figure 22-34. The flex items are now all the same width
Search WWH ::

Custom Search