div, p, aなどの要素を二つ繋げたものを一つのドロップシャドウで処理するスタイルシートのテクニックを紹介します。 上がborder:1px;の状態、下がbox-shadowで一つにした状態です。 Drop shadow for 2 elements preserving the intersection in CSS 凸型の要素はタブや上からコンテンツをひっぱりだす時によく使われ、デモではひっぱりだすトグル用に「Show / Hide」と書いてあります。 ※このデモではトグルとしての機能は実装されていません。 デモページ 実装は非常にシンプルです。 HTML 二つの要素はdivでもpでもaでもブロックとなる要素なら何でも構いません。ポイントは二つの要素を内包するdiv要素を設けることです。 <div class="block"> <div class="innerblock"> <p