私のウェブサイトには、次のレイアウトがあります。
outer-div with display: table
inner-div with display: table-row and width/height 100%
list-div with display: table-cell and width 25%
detail-div with display: table-cell and height 75%
list-div 内には、いくつかの li 要素を持つ ul があります。詳細 div には、幅/高さが 100% の別の div があります。これが最初の画像です: http://puu.sh/5e1wo.png
リスト要素の上余白に注意してください。プロジェクトの 1 つをクリックすると、detail-div 要素内にその (html-) 説明を追加するというアイデアがあります。次の図でわかるように、機能しますが、奇妙にもリスト要素のマージンにも影響します: http://puu.sh/5e1HI.png http://puu.sh/5e1Iq.png
最初の共通アンカーが 3 レベル上にある場合でも、リスト要素が他の div のコンテンツに整列しているように見えます。これを回避する方法はありますか？