odin-css-exercises/flex/01-flex-center/solution/solution.css

29 lines
605 B
CSS
Raw Normal View History

2021-08-24 06:32:36 -07:00
.container {
background: dodgerblue;
border: 4px solid midnightblue;
width: 400px;
height: 300px;
}
.box {
background: palevioletred;
font-weight: bold;
text-align: center;
border: 6px solid maroon;
width: 80px;
height: 80px;
2021-08-24 08:03:48 -07:00
}
/* SOLUTION */
/* disclaimer: duplicating the `.container` selector here isn't best practice.
In your solution you probably put it right inside the existing `.container`,
which _is_ the best practice.
We separated it out here to make it extra clear what has changed. */
.container {
display: flex;
align-items: center;
justify-content: center;
2021-08-24 06:32:36 -07:00
}