Cory's profile picture

Published by

published
updated

Category: Web, HTML, Tech

🖥 CSS Snippet: Social Media Dock

Do you want the little link thing with your socials to look better? Here's some code you can use! Caveat: This works on my profile. It might not work on yours? You can adjust the "font-size" to make the icons smaller and adjust the "transform:scale" to your liking. But this I think looks a little cleaner than what's already there.


<style>
.profile .left .table-section:last-child .details-table tbody {display:flex;}
.profile .left .table-section:last-child .details-table tbody tr{display:flex;flex-direction:column;flex:1;line-height:0;}
.profile .left .table-section:last-child .details-table tbody tr td{width:100%!important;text-align:center;background:none;}
.profile .left .table-section:last-child .details-table tbody tr td p a{font-size:0;transition:all .3s}
.profile .left .table-section:last-child .details-table tbody tr td p img{font-size:64px;opacity:.4;transition:all .3s;height:auto;margin:0;}
.profile .left .table-section:last-child .details-table tbody tr td p a:hover img{opacity:1;transform:scale(1.5);z-index:10;}
</style>



12 Kudos

Comments

Displaying 2 of 2 comments ( View all | Add Comment )

Bunny

Bunny's profile picture

I like this a lot! Thank you


Report Comment

alyssa ciervo

alyssa ciervo's profile picture

i tried changing still wont work


Report Comment