How to make sticky social media in blogger

Design help Custom code
1

Hello dear… please help mee… i wish my social media button sticky like a blog https://www.igniel.com/2017/01/cara-pasang-facebook-open-graph-baik-benar.html … follow the scroll and the share buttton stop in bottom end of article

Screenshot_20
Screenshot_20853×438 51.6 KB

Screenshot_21
Screenshot_21917×705 84.2 KB

how fix this

this is my css share social code blogger

/* Share button */
.share-this-pleaseeeee {
display: inline-block;
margin: 0;
color: #afafaf;
text-transform: uppercase;
font-size: 16px;
background: #fff;
z-index: 1;
position: relative;
padding: 0 10px;
font-weight: 500;
}
#share-container {
margin: 20px auto;
overflow: hidden;
}
#share {
width: 100%;
text-align: center;

}
#share a {
width: 25%;
height: 40px;
display: block;
font-size: 24px;
color: #fff;
transition: opacity 0.15s linear;
float: left;
}
#share a:hover {
opacity: 0.8;
}
#share i {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.facebook {
background: #3b5998;
}
.twitter {
background: #55acee;
}
.googleplus {
background: #dd4b39;
}
.linkedin {
background: #0077b5;
}
.pinterest {
background: #cb2027;
}
.whatsapp {
background: #25d366;
}

And this code html social share

 <b:includable id='postsharebutton' var='post'>
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
  <!-- facebook -->
  <a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' rel='nofollow' target='blank'><i class='fa fa-facebook'/></a>
  <!-- twitter -->
  <a class='twitter' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='blank'><i class='fa fa-twitter'/></a>
  <!-- google plus -->
  <a class='googleplus' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:blog.url' rel='nofollow' target='blank'><i class='fa fa-google-plus'/></a>
  <!-- linkedin 
  <a class='linkedin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='blank'><i class='fa fa-linkedin'></i></a> -->
  <!-- pinterest 
  <a class='pinterest' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;amp;media=&quot; + data:blog.postImageUrl + &quot;&amp;amp;description=&quot; + data:post.title' rel='nofollow' target='blank'><i class='fa fa-pinterest-p'></i></a> -->
  <a class='whatsapp' data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%20%2D%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
</b:includable>

plese help me

3

i have same problem in ozil store