PumpkinGutz's profile picture

Published by

published
updated

Category: Web, HTML, Tech

How to change your contacting options buttons ★

Copy and paste this into your about me :) for now I've put emojis but you can change them to images (by putting this in the emojis place; <img src="enter image url" width="px" height="px">

Here's mine:

<style>

.contact .inner a img {

    font-size: 0;

}

.contact .inner a img:before {

    font-size: 1em;

    display: block

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {

 /* Add to Friends */

 content: "🌱"

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {

 /* Add to Favorites */

 content: "🖤"

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {

 /* Send Message */

 content: "🐌"

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {

 /* Forward to Friend */

 content: "💚"

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {

 /* Instant Message */

 content: "★"

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {

 /* Block User */

 content: "🩹"

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {

 /* Add to Group */

 content: "🍄"

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {

 /* Report 

Profile */

 content: "🕯️"

}

</style>


4 Kudos

Comments

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

eii°д°

eii°д°'s profile picture
Pinned

THANKS!! In content I used "content:url("")"


Report Comment



for images

by eii°д°; ; Report

yes! Thank you for adding

by PumpkinGutz; ; Report