Fixed footer to the bottom

This commit is contained in:
amitmerchant1990 2019-07-28 14:09:08 +05:30
parent feb2f502e3
commit ace40eff00
2 changed files with 42 additions and 26 deletions

View File

@ -19,34 +19,38 @@
<body>
<div id="bar"></div>
<div class="wrapper-masthead">
<div class="container">
<header class="masthead clearfix">
<a href="{{ site.baseurl }}/" class="site-avatar"><img src="{{ site.avatar }}" /></a>
<div class="wrapper-container">
<div class="wrapper-masthead">
<div class="container">
<header class="masthead clearfix">
<a href="{{ site.baseurl }}/" class="site-avatar"><img src="{{ site.avatar }}" /></a>
<div class="site-info">
<h1 class="site-name"><a href="{{ site.baseurl }}/">{{ site.name }}</a></h1>
<p class="site-description">{{ site.description }}</p>
</div>
<div class="site-info">
<h1 class="site-name"><a href="{{ site.baseurl }}/">{{ site.name }}</a></h1>
<p class="site-description">{{ site.description }}</p>
</div>
<nav>
<a href="{{ site.baseurl }}/">Home</a>
<a href="{{ site.baseurl }}/search">Search</a>
<a href="{{ site.baseurl }}/about">About</a>
</nav>
</header>
<nav>
<a href="{{ site.baseurl }}/">Home</a>
<a href="{{ site.baseurl }}/search">Search</a>
<a href="{{ site.baseurl }}/about">About</a>
</nav>
</header>
</div>
</div>
</div>
<div id="main" role="main" class="container">
{{ content }}
</div>
<div class="wrapper-main">
<div id="main" role="main" class="container">
{{ content }}
</div>
</div>
<div class="wrapper-footer">
<div class="container">
<footer class="footer">
{% include svg-icons.html %}
</footer>
<div class="wrapper-footer">
<div class="container">
<footer class="footer">
{% include svg-icons.html %}
</footer>
</div>
</div>
</div>

View File

@ -17,6 +17,7 @@
html {
font-size: 100%;
height: 100%;
}
body {
@ -26,6 +27,7 @@ body {
line-height: 1.7;
font-weight: bold;
font-size: 15pt;
height: 100%;
}
.container {
@ -334,10 +336,20 @@ nav {
}
}
.wrapper-container {
min-height: 100%;
position: relative;
}
.wrapper-main {
padding-bottom: 134px;
}
.wrapper-footer {
margin-top: 50px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
position: absolute;
bottom: 0;
width: 100%;
height: 89px;
background-color: $lightGray;
}