Page content is extending behind nav bar

[jamjahal]

Hi, I love this theme, thank you!

But I am running into an issue where the page content is being hidden by the menu bar on the left, and the contact page is actually going over the nav menu. Not on all pages (portfolio and intro are fine) but the rest are not making room for the nav bar.

Would love to know what is causing this.

[jimmychang851129]

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.

[jimmychang851129]

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