« Back to the HTML Forum

can someone help me with the order of the codes?

мαєνιє's profile picture

Posted by мαєνιє

posted

Forum: HTML Group

View Topics View Profile

i'm very new here and dont understand much about how all the coding stuff works, so i'm envisioning a profile that i cant seem to make.


i want a background img (like the bg of the page) and a solid color in the box where all the profile thingies are. i'm also facing dificulties with changing the icons of the interactions buttons (add friend, send msg etc etc). 


id like to know how to make my pfp different in my profile and in the comments so it can be star-shaped BUT IDK IM NOT FINDING THE CODE AND I'M TOO SHY TO ASK ANYBODY 


if someone rlly kind wants to help me id appreciate it much </3


Report Topic

1 Reply

Syka's profile picture

Reply by Syka

posted

hai! this is the code for changing the contact box icons, js put the url of the icons u wanna on the places where i typed "PUT UR DESIRED ICONS URL HERE" (keep the quotation mark js erase the text and put ur url in it)


<style>

.contact .inner a img {

  font-size: 0;

}

.contact .inner a img:before {

  font-size: 1em;

  display: block

}

.contact .inner a:before {

  content: ""

}



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

  /* add to friends */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* add to favorites */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* send Message */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* forward to friend */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* instant message */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* block user */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* add to group */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

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

  /* report user */

  display: inline-block;

  background: url("PUT UR DESIRED ICONS URL HERE")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

</style>


Permalink Report Reply