プロ生ちゃんとお勉強するよ~プロ生ちゃんとお勉強するよ~プロ生ちゃんと一緒にプログラミングをお勉強できるサイトです。TOP作者への連絡img下の隙間をなくすにはそれでは、imgの下にできてしまう謎の隙間を除去する方法について勉強するね!!。src="img01.png">(解りやすいように、背景色を青にしています。)まずは、この隙間の正体について解説しますね。解りやすいように文字と画像を1行に並べてみました。画像の一番下(青のライン)と、文字の一番下(赤のライン)の位置に着目してください。画像の下端は文字の下端よりも若干上に表示されています。じつは、この赤のラインと、青のラインの差が、謎の隙間の正体になります。文字は、baselineを基準として描画されます。baselineの位置になります。imgタグもこのbaselineの位置を基準に描画されます。square直下になります。squareの位置の差が謎の隙間となって現れています。この隙間を無くすにはどうすればいいか?そうです。文字の下端と、画像の下端が同じ位置に描画されるように調整すればいいのです。画像描画の垂直位置をどのラインを基準に描画するかを調整するには、CSSのvartial-align属性で行います。squareに合わせてみます。vertical-alignをbottomに設定します。bottom;}</style>謎の隙間が無くなりました。本キャラクターに関する著作権およびその他一切の権利は、プログラミング生放送および、それらの関連企業・関係者に帰属しています。これは、著作権およびその他一切の権利を放棄・譲渡するものではありません。動画をサムネイル表示で管理!!大量の動画を直観的に管理できます。FavMovieAlbum無料です。PCとスマフォでスケジュールを管理!!Googleカレンダーと同期できるスケジューラFavGCalScheduler無料です。iPhoneの壁紙がいっぱい「i-Flick壁紙」無料ですデジカメ写真を劣化無しで回転!!FavPhotoRotate(無料)です。ツイートプロ生ちゃんとお勉強するよ~プロ生ちゃんと一緒にプログラミングをお勉強できるサイトです。わびさびサンプルソース。