IDEA1

■テキスト回り込み禁止

アマンドーレ

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

ベジタブルサンド

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

■Floatさせた要素への食い込み禁止

キャラメルラテ

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

チキンサンド

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

■overflow基本設定

【コラム】overflow: hidden;の基本機能について

overflowプロパティの基本的な使い方をここでおさらいしよう。サンプルでは幅400pxの画像の表示幅を300pxに設定して表示している。1枚目は通常（CSSなし）、2枚目はoverflowのhidden、3枚目はscrollによって設定されている。 1枚目は幅を300pxと設定しているにも関わらず、そのまま400pxで表示されている。これはボックスからはみ出した部分がそのまま表示されるvisibleという値が初期値として設定されているからである。2枚目のhiddenははみ出た部分が表示されず、3枚目のscrollはスクロールして表示される。まずはこの基本機能をしっかり抑えて欲しい。

通常画像

レモンティー

overflow; hidden;設定画像

レモンティー

overflow; scroll;設定画像

レモンティー