- index.html
- style.css
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Challenge: Flags</title>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="flag ireland"></div>
<div class="flag trinidad"></div>
<div class="flag congo"></div>
<div class="flag mauritius"></div>
<div class="flag botswana"></div>
<div class="flag madagaskar"></div>
</body>
</html>
CSS
html,
body {
margin: 0;
padding: 0;
}
body {
padding-top: 30px;
padding-left: 15px;
width: 505px;
height: 260px;
}
.flag {
float: left;
margin-right: 15px;
margin-bottom: 30px;
width: 150px;
height: 100px;
border: 1px solid #aaaaaa;
background-color: #ffffff;
}
.ireland {
/* colors: #009b48, #ffffff, #ff7900 */
}
.trinidad {
/* colors: #ce1126, #ffffff, #000, #ce1126 */
}
.congo {
/* colors: #009543, #fbde4a, #dc241f */
}
.mauritius {
/* colors: #ea2839, #1a206d, #ffd500, #00a551 */
}
.botswana {
/* colors: #449ed3, #ffffff, #000000 */
}
.madagaskar {
/* colors: #fc3d32, #007e3a */
background-position: 50px 0;
background-repeat: no-repeat;
}
- Goal
- Result
- Overlay
- Differences
- ?
Press Compare to send your code for review.