html - 固定ヘッダーとフッターの間に正確に表示されるアンカーを配置するにはどうすればよいですか?

Question

コンテンツが固定ヘッダーとフッターの下にあり、アンカーをナビゲートでき、アクティブなアンカーのみが表示され、残りはフッターとヘッダー (ウィンドウのような) の下に隠されているサイトを作成したいと考えています。コンテンツ、ヘッダー、フッターを配置しましたが、クリックしたアンカーのコンテンツがヘッダーとフッターの間の正確な場所に表示されるようにアンカーを設定する方法がわかりません。

誰かが私がやりたいことを理解してくれることを願っています

CSS と html だけは jquery や js を使いたくない

---

例: 編集: http://cdpn.io/olvhq

Answer 1

プロパティでこれを行うことができbox-sizingます。

そのようです：

フィドル 1 フィドル2

.container
{
    height: 100%;
    background: pink;
    margin: -64px 0;
    padding: 64px 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.content {
    overflow:auto;
    height:100%;
}
header
{
    height: 64px;
    background: purple;
    position: relative;
    z-index:1;
}
footer
{
    height: 64px;
    background: gray;
    position: relative;
    z-index:1;
}

Answer 2

よくわかりませんが、試してください：

#anchor {    
  position:absolute;
  top:50%;
}