Shannt
Regular poster
Registered: 02-2019
Location: Texas
Posts: 143
Karma: 0 (+0/-0)
|
Reply | Quote
|
|
Small Icon Beside Username
Is there a way to have a small icon on the left side of the username?
---
|
7/31/2020, 4:06 pm
|
Link to post
Email Shannt
PM Shannt
|
Susa
Global Administrator
Registered: 07-2006
Location: Oχάιο
Posts: 4623
Karma: 128 (+137/-9)
|
Reply | Quote
|
|
Re: Small Icon Beside Username
There is! Do you want it to the left of just your name or of everyone's name. If you want it to the left of everyone's name, here is how I do it:
.postlistusername a.user_link {
display: block; text-indent: 33px; height: 50px;
background: url('https://images41.fotki.com/v1661/photos/5/3831375/14567330/bubbles2-vi.gif') no-repeat left top;
}
Here is how I did it for just one person:
.susa .postlistusername a.user_link {
display: block;
text-indent: 33px;
height: 50px;
background: url(https://images41.fotki.com/v1661/photos/5/3831375/14567330/bubbles2-vi.gif) no-repeat left top;
}
Obviously I did this at two different times in my board life because I have them set up two different ways, but they say the about the same thing.
|
7/31/2020, 4:58 pm
|
Link to post
PM Susa
Blog
|
Shannt
Regular poster
Registered: 02-2019
Location: Texas
Posts: 143
Karma: 0 (+0/-0)
|
Reply | Quote
|
|
Re:
I'm using the code below to add a blinkie under my name. Is there a way to have both a small icon and blinkie at the same time? I added the code you gave me and the blinkie disappeared.
.shannt .postlistusername a:link,
.shannt .postlistusername a:visited {
display: block;
padding-bottom: 25px;
margin-bottom: -1em;
position: relative; z-index: 2;
text-shadow: 0 0 0px #000000;
background:url(https://s7.gifyu.com/images/proudmom.gif) bottom center no-repeat;
}
---
|
7/31/2020, 6:04 pm
|
Link to post
Email Shannt
PM Shannt
|
Susa
Global Administrator
Registered: 07-2006
Location: Oχάιο
Posts: 4623
Karma: 128 (+137/-9)
|
Reply | Quote
|
|
Re: Small Icon Beside Username
Ahhhhhh, that I don't know. I am a code copier from my own board or other boards where I know to find it. I do not know how to make code. I will send for help.
|
7/31/2020, 6:12 pm
|
Link to post
PM Susa
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: Small Icon Beside Username
Try this:
.shannt .postlistusername a:link,
.shannt .postlistusername a:visited {
display: block;
text-indent: 20px;
padding-bottom: 28px;
margin-bottom: -1em;
position: relative; z-index: 2;
text-shadow: 0 0 0 #000000;
background:url(https://s7.gifyu.com/images/proudmom.gif) bottom center no-repeat, url(https://img.runboard.com/img/default_post_icons/happy.gif) no-repeat left top;
}
That last line shows how to put two different backgrounds in the same element. You can also more than two, just by separating them with commas the way I did here.
|
7/31/2020, 6:57 pm
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Shannt
Regular poster
Registered: 02-2019
Location: Texas
Posts: 143
Karma: 0 (+0/-0)
|
Reply | Quote
|
|
Re:
Okay. Another issue I'm having is finding where this border is so I can make it 2px instead of 1.
---
|
7/31/2020, 7:16 pm
|
Link to post
Email Shannt
PM Shannt
|
Shannt
Regular poster
Registered: 02-2019
Location: Texas
Posts: 143
Karma: 0 (+0/-0)
|
Reply | Quote
|
|
Re:
Is there a way to get the icon closer to my username?
---
|
7/31/2020, 7:23 pm
|
Link to post
Email Shannt
PM Shannt
|
Susa
Global Administrator
Registered: 07-2006
Location: Oχάιο
Posts: 4623
Karma: 128 (+137/-9)
|
Reply | Quote
|
|
Re: Small Icon Beside Username
We need to wait for Lesa to come back. I am not sure what time she is going to work, so if she doesn't come soon, that is why.
For that border, you can hunt for 1px in your CSS and perhaps find it.
For moving the icon closer, fiddle with the text indent or padding.
Be sure you save your CSS in a file somewhere, so that you can put your original CSS back on your board in case you make a change you don't like and can't figure out where you did it.
|
7/31/2020, 8:12 pm
|
Link to post
PM Susa
Blog
|
Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: Small Icon Beside Username
My apologies for not coming back sooner.
I see this in your CSS:
.ak_msg_post_master_table td{
border : 2px solid #725643;
border-left : 0px solid #000;
border-top : 0px solid #000;
text-align: center;
}
You can remove the border definitions there, so it only says:
.ak_msg_post_master_table td{
text-align: center;
}
For the icon thing, I forgot your text is centered. You could try something like this:
background: url(https://s7.gifyu.com/images/proudmom.gif) bottom center no-repeat, url(https://img.runboard.com/img/default_post_icons/happy.gif) 25% top no-repeat;
You can use px or em instead of %, or even instead of top/bottom. Pixels are fixed-width, em is determined by the font-size, and % is relative to the width of that table/box/bordered area.
|
8/2/2020, 6:57 pm
|
Link to post
Email Lesigner Girl
PM Lesigner Girl
Blog
|
Shannt
Regular poster
Registered: 02-2019
Location: Texas
Posts: 143
Karma: 0 (+0/-0)
|
Reply | Quote
|
|
Re:
Thank you!
---
|
8/4/2020, 8:14 pm
|
Link to post
Email Shannt
PM Shannt
|