- やることは簡単、横並びにしたい要素を親要素で囲んであげてdisplay:flexを指定するだけでOK
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>SCSS</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="oya">
<div class="box green"></div>
<div class="box yellow"></div>
<div class="box red"></div>
</div>
</body>
</html>
.box {
width: 100px;
height: 100px;
}
div.green {
background: green;
}
div.yellow {
background: yellow;
}
div.red {
background: red;
}/*# sourceMappingURL=style.css.map */
.oya {
display:flex;
}
コメント