Here is an example of a content area. The header above contains meta, title, subtitle, and a featured image, with all body content located beneath. .article-content.
Introduction
This paragraph introduces the purpose and demonstration of the article.
Requirements
- Proper IDs on section headings
- Table of Contents links match these IDs
- Responsive header sizing
Steps
Step 1: Verify Structure
Confirm that the header ends prior to the content section.
Step 2: Add IDs
Provide a matching ID for each H2/H3 element listed in the Table of Contents. id.
Step 3: Test ToC Links
Test the sidebar Table of Contents links to confirm smooth transitions to the sections.
Conclusion
Separating the header and content avoids layout problems and enhances SEO and UX.