CSS：position = fixedとheight = auto

Question

私は、スクロールのヘッダーの固定位置を持つページを持っています。 StackOverflowのトップメニューと同様です。

1行または複数行に情報を表示できるので、height = autoを使用する必要があります。私のヘッダーより2つ以上の行を使用した場合、ページの本文に表示されます。

これは、set body margin-top = header widthによってJSスクリプトで解決できます。

JSを使用しないCSSでこの状況を解決する方法はありますか？

Answer 1

純粋にCSSで行うことはできません。 position: fixedの要素は通常のページフローから取り出されるため、ページ上の他の要素の位置の計算には使用されません。

position: fixedの2つのヘッダーとそのような宣言のない1つのヘッダー（リンク、入力フィールド、またはボタンが静的テキストに置き換えられた「アクティブな」ページ要素）をレンダリングでき、ページ要素を下にします。しかし、それはひどいハックだろう。