HB 06 修正

b:id:smoking186
div.header下のh2を角丸にする方法を思いついたので実行。
div.headerをとりあえず青背景にして右にmarginを20%。div.headerで右上の角を丸めておいて、h2で右下の角を丸める。その後、ul.bookmarkinfoを白背景にして、右側のmarginを負にしてずらして完成。ul.bookmarkinfoは必ず存在するのでどのページでも大丈夫。
具体的には以下の様なcssになる。

div.header {
 margin: 0px 20% 0px 0px;
 padding: 0px;
 background-color: blue;
 background-url: /* 右上用角画像 */;
 background-position: right top;
 background-repeat: no-repeat;
}

div.header h2 {
 margin: 0px;
 padding: 5px;
 background-color: transparent;
 background-url: /* 右下用角画像 */
 background-position: right bottom;
 background-repeat: no-repeat;
}

div.header ul.bookmarkinfo {
 margin: 0px -20% 0px 0px;
 padding: 10px;
 background-color: white;
}

ということはh2の角丸を諦めれば、色々出来る。リキッドな影付き(右下方向)も出来そうだ。
div.headerで右方向の影を出し、h2で下方向の影を出す。右方向のはみ出た部分をul.bookmarkinfoで消してやれば良いのかな。