適切なレスポンシブ

家事や子育てで、皆さんも毎日忙しい日々をお過ごしですか？　

こんにちは、関西在住で主夫歴５年越のYUJIです。

画像がうまく画面に収まらない

今日は、サイト製作あるあるの一つである「画像が上手く画面に収まらない」というケースに触れたいと思います。

さっきまで悪戦苦闘していましたが、結果としては、CSSの調整により、対象となる要素（img）に対して、Max-width: 100%;をあててあげれば良いことを学びました。

コードイメージは、このようになります。

div img {
    max-width: 100%;
    height: auto;
    text-align: center;
}

現在の模写サイトの作成状況は、次のキャプチャ画像になります。

画面がはみ出てしまう製作サイトにならないよう、注意したいですね。

それでは、また。