Problem?
For some reason the first section below header (it is a "mobile friendly" website) is not being rendered in mobile view. It remains blanco.
It is only a small part of the CSS, so It's not a obvious CSS issue either.
What I have done?
1) Cloned a template and build my own layout with JEKYLL static site generator.
2) This template had a classic rootdirectory (css
+ index.html
file).
3) I added {% SEO%}
tag to <head>
4) I encountered an issue described here Why does liquid {%SEO%} tag not get integrated into head? instead it shows in body
5) I added yaml-front-matter to index.html
to solve the issue, but also changed the rootdirectory to a jekyll architecture (_includes
+ _layouts
+ frontmatter in index.html
6) At the same time I attempted to reduce http requests by minifying the many css files into 1 file.
7) After I discovered the issue with the mobile view not being rendered I changed everything back to classic. Yet the problem remains.
Minimal
---
---
<!DOCTYPE html>
<html class="no-js" lang="zxx">
<body data-spy="scroll" data-target="#primary-menu">
{{ content }}
</body>
</html>
What I expect to happen?
That after adding yaml-front-matter, my mobile friendly website is rendered perfectly.
Link to responsive.css: https://github.com/bomengeduld/debadkamers/blob/master/css/responsive.css
Link to style.css: https://github.com/bomengeduld/debadkamers/blob/master/style.css
Link to index.html: https://github.com/bomengeduld/debadkamers/blob/master/index.html
Link to website: https://bomengeduld.github.io/debadkamers/