Work Note -9ページ目

フロート解除clearは上マージンを増加させる

■clearは上マージンを増加させる


clearはfloatを解除するために、上マージンを増加させて、先行するフロートの下辺より

clear したボックスの上辺が下にくるようにします。



IE6バグ

IE6はclearしたボックスにmargin-topをすると、実際よりも余白が大きくなってしまうバグがある。

(IE6だけcssを正しく表示できない=他のブラウザと表示が異なる)


→Clearを指定した要素には上マージンは指定しない!


●回避

clearを指定した以外のセレクタで、topまたはbottomなどで設定する。




・関連:フロート解除clearの指定で不要な余白(padding)ができる

デザインカスタマイズ-上部ナビを消す

上部ナビ消します


レイアウト上部にあるユーザーナビを消しました。



 ●削除部分

  ニックネーム & ルーム|ブログ|フォト|相談|プレゼント



cssでカスタマイズできます。



削除部分 <Div id="userNaviArea">

-----------------------------------------------

#userNaviArea {
display: none;
}

-----------------------------------------------

上記をcssに追記すれば削除できます。



ちなみにいらない部分を削除するときは、

CSSにどちらかを記述(指定場所によって使い分けてね)


visibility: hidden;


もしくは


display: none;


カスタマイズbody背景

body背景


bodyの背景に設定したが、若干もと画像より小さくなっている。

これから解明、もしくはこのままで妥当なデザインを考える。。。


--------------------------------------------------------

画像登録→参照URL


 ①ブログ>アメブロを書く>画像フォルダで画像登録

 ②登録画像のプロパティで画像URLを参照 ※最後の「_s」はとる~サムネイル用の小さい画像URL


--------------------------------------------------------




****************************** 追記 ******************************

解決


Q. 画像がもとの登録画像より小さく表示される


A. 登録画像の幅が大きすぎたため。

  目安はヘッダの登録画像と同じ、最大800pxでつくるようにする。

  今回は当初1230px→720pxで成功


【 まとめ 】

部品画像の幅は800px以内で制作しよう!