インクルードした要素がヘッダーにかぶってしまう

ワードプレスの固定ページで、フレックスボックスをたて並びにしてヘッダー固定のレイアウトを作っています。

編集の利便性のために、別ファイルのphpを合間にインクルードして表示しているのですが、その部分のみヘッダー（potision:sticky）の上に重なって表示されてしまいます。（見た感じはz-indexで上に重なっているような感じです）

これは何が起きているのでしょうか？
該当部分に何か指定をいれることで解消しますか？？

質問者からの補足コメント

• ちがいます。
  インクルードした部分のみ、stickyしている要素よりも上に表示されています。
  その原因がわからず質問しています。

  No.1の回答に寄せられた補足コメントです。 補足日時：2022/09/14 10:23

• 再度回答ありがとうございます。
  インクルードしているのは本文の一部であり、表です。
  
  body直下にコンテナー（div）があり、display:flexを指定しています。
  その中にヘッダー、コンテンツ、フッターがあり、
  ヘッダーにposition:sticky、
  コンテンツにflex:1、
  フッターには特に指定していません。
  
  コンテンツの内部に別ファイルのphp（中身は表）をインクルードして２箇所表示しているのですが、
  その部分だけがヘッダーと重なったとき、ヘッダーの表示よりも上に重なって表示されてしまっているんです。
  ほかの部分（同じファイルに直書きの部分）はちゃんとヘッダーの下に潜り込むように表示されます。（重なると見えなくなる）

  No.2の回答に寄せられた補足コメントです。 補足日時：2022/09/14 11:54

No.3 ベストアンサー 回答者： t_fumiaki 回答日時： 2022/09/14 14:11

>>ほかの部分（同じファイルに直書きの部分）はちゃんとヘッダーの下に潜り込むように表示されます。

（重なると見えなくなる）

ヘッダーのみに、position:sticky、が有る時の正常な動きです。


>>その部分だけがヘッダーと重なったとき、ヘッダーの表示よりも上に重なって表示されてしまっているんです。

ヘッダーの下の区画にposition:stickyが指定されていると、上に重なります。

他要素のposition指定とも関連するので、全体のソース＆cssが見え無い以上は無理です。

この回答へのお礼

positionがらみのcssをすべて確認してみたら、表の一部に「position:relative」「position:absolute」の指定がされている箇所があり、それを外してみたら無事になおりました。
何度もご回答くださりありがとうございました。

お礼日時：2022/09/14 15:32

No.2 回答者： t_fumiaki 回答日時： 2022/09/14 11:46

インクルードした部分に、sticky指定が有るのでは？

そうすれば、それがヘッダーの上に重なって上スクロールされます。

No.1 回答者： t_fumiaki 回答日時： 2022/09/13 19:55

potision:sticky;なんだから当然でしょ？

floatなんだから、他の要素に重なるように上に来て静止。