スクロール追従するSNSボタン

コンテンツの最後でなく、常に画面に表示(スクロールに追従)するシェアボタンを設定します。
 

そのまま画面左下に固定

/* シェアボタンが最後尾のコンテンツとかぶるのを防ぐ */
.page {
    padding-bottom: 40px;
}
.shareBtns {
    position: fixed;
    bottom: 16px;
    left: 16px;
    z-index: 9;
}
CSS

ボタンの文字をなくし、丸く変更する場合

サンプル画像
サンプル画像
 
/* シェアボタンが最後尾のコンテンツとかぶるのを防ぐ */
.page {
    padding-bottom: 40px;
}
.shareBtns {
    position: fixed;
    bottom: 16px;
    left: 16px;
    z-index: 9;
}
.shareBtns__tw {
    border-radius: 50%;
    height: 40px;
    width: 40px;
    padding: 0;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
}
.shareBtns__tw__icon {
    margin: 0;
}
.shareBtns__tw__text {
    display: none;
}
CSS