Page content is extending behind nav bar about jekyll-theme-prologue HOT 2 OPEN

As far as I know. You can refer to the file _sass/jekyll-theme-prologue

The width of the navbar and the section are declared in line 500, 644 respectively

Therefore, you can change the width to adjust to your need. Though I don't think this is the best solution.

from jekyll-theme-prologue.

I solved this problem by setting the width of header(line 500) to 18%, and the margin-left of main(line 644) and footer(around line 614 to 18%)

In the _includes/section.html I add the following code:

{%- if _title == "Profile" -%}
<section id="{{- _slug -}}" class="{{- _class -}}" style="margin-left:18%">
  <div class="container">
    {{- _photo -}}
    {{- _heading -}}
    {{- include.content -}}
  </div>
</section>
{%- else -%}
<section id="{{- _slug -}}" class="{{- _class -}}">
  <div class="container">
    {{- _photo -}}
    {{- _heading -}}
    {{- include.content -}}
  </div>
</section>
{%- endif -%}

In my case, I have created a profile.html in _sections/ directory. I changed the code in _includes/section.html. When the program try to render the profile.html page, I will add an additional attribute to the section: style="margin-left:18%", which obviously move the block to avoid colliding with the navbar.

In this case, the word in profile section won't be covered by the navbar

from jekyll-theme-prologue.