html,cssファイルの初期設定
【ヘアサロンサイト課題のヒント】サイト全体の設定にある下記の記述があることを前提として、解説を行います。
ご自身で設定されたクラス名と異なる場合は、置き換えて考えてください。
index.html
style.css
body {
font-family: 'Taviraj', serif;
font-size: 14px;
}
a{
text-decoration: none;
color: #000;
}
/* 共通クラス
/================*/
.container {
max-width: 1140px;
margin: 0 auto;
}
.my-10 {
margin-top: 10rem;
margin-bottom: 10rem;
}
.row {
display: flex;
align-items: center;
}
.col-5 {
flex: 0 0 50%;
}
/* ======================================
/ タブレット以下での表示調整
/======================================*/
@media(max-width: 768px){
.row {
flex-direction: column;
}
}
また、解説でご紹介する方法とは別の組み方をされている箇所もあると思います。
デザイン通りに表示されていれば、解説に合わせて変更する必要はありません。