InsaneJournal

Tweak says, "I can has cheezburgr!"

. (ex_trollop527) wrote in rp_tutorials,
@ 2013-01-05 18:01:00

Hey, I was wondering if anyone knew the code to make the default icon on a journal round instead of square? Unfortunately the journal I saw this on changed it back so I can't give you an example, but it was definitely a code and not just an icon photoshopped into a circle because the icon looked normal on the userpics page! If anyone has this code, I would love you forever.

(Post a new comment)

tessisamess
2013-01-05 11:44 pm UTC (link)

If it's S1 style, then in your layout's CSS, use:

table table .index img {
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}

If you're using S2 I believe you use:

.outer-entry-userpic img{
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}

However, I don't use S2 that often, so I could be wrong. :3 Hope that helped!

(Reply to this) (Thread)

	evaakeru 2013-01-06 01:58 pm UTC (link)
	-moz-border-radius is no longer needed for Firefox. If the questioner saw it revert back it is highly likely that the layout only used the -moz prefix and now that Firefox goes by the default border-radius the icons are showing as square instead of round. (Reply to this) (Parent) (Thread)

	tessisamess 2013-01-06 02:04 pm UTC (link)
	Ah. I never bother with FF unless I'm cross-testing. (Reply to this) (Parent) (Thread)

	evaakeru 2013-01-06 02:07 pm UTC (link)
	I use FF since, unfortunately, some of my favorite add-ons have no equivalent for Chrome. (Reply to this) (Parent) (Thread)

	tessisamess 2013-01-06 10:41 pm UTC (link)
	Yuss :( I can't remember which it is atm for some reason, but there's one add-on I used to use on FF that I sometimes find myself wishing I had on Chrome. (Reply to this) (Parent) (Thread)

evaakeru
2013-01-15 06:26 am UTC (link)

Checked caniuse.com since I hadn't in a while and all browsers now default to the border-radius at this point. The only reason to leave in the webkit or moz prefix is for those goobs who haven't updated their browser in over 3 releases [Safari. All other browsers go farther back]. And honestly, if you haven't updated your browser in that long, you don't deserve to see all the pretties.

(Reply to this) (Parent) (Thread)

	tessisamess 2013-01-15 06:30 am UTC (link)
	LMAO, right? I mean, sometimes I don't update for a while, but it's never long enough that it really matters. I just get lazy and paranoid that my tabs won't restore. XD (Reply to this) (Parent)

	ex_trollop527 2013-01-06 09:47 pm UTC (link)
	This actually isn't working, is there somewhere specific I have to put it? I'm using S1 btw. (Reply to this) (Parent) (Thread)

	tessisamess 2013-01-06 10:44 pm UTC (link)
	Can I see your layout coding? :) Just copy it and paste it in a comment in a <textarea></textarea> and I'll be able to go through it for you. (Reply to this) (Parent) (Thread)

Did it right this time!

ex_trollop527
2013-01-07 12:11 am UTC (link)

FRIENDS_TALK_READLINK=><a href="%%urlread%%">%%messagecount%%</a>

FRIENDS_DATE_FORMAT=><span style="color:#DDCCCB;">%%monlong%%, %%dth%% %%yyyy%% at %%12h%%:%%min%%%%ap%%</span>

LASTN_WEBSITE<=
<style type="text/css">
table table table table .meta {visibility:hidden; position:absolute; top:1px;}
table table table table table .meta {visibility:visible; position:relative; top:1px;}
tr.caption {display:none;}
.higuys {font-family: arial; font-size:9px; line-height:9px; letter-spacing:1px;}
table table .index img {
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}
}</style>

<tr><td colspan="5" width="200">
<table align="center" cellspacing="0" border="0" cellpadding="0">
<tr><td align="center"><font class="higuys"><a href="http://username.insanejournal.com/info">USERINFO</a><br>
<a href="http://username.insanejournal.com/friends">FRIENDS</a><br>
 <a href="http://username.insanejournal.com/calendar">CALENDAR</a></font>
</td></tr></table></td></tr>
<=LASTN_WEBSITE

(Reply to this) (Parent) (Thread)

	Re: Did it right this time! tessisamess 2013-01-08 07:00 am UTC (link)
	Sorry for the delay lol. Got caught up with some other stuff. The CSS needs to be in between `GLOBAL_HEAD<=` and `<=GLOBAL_HEAD`. Just remember not to stick `LASTN_WEBSITE<=` inside of the `GLOBAL_HEAD`. Hope that helped! ♥ (Reply to this) (Parent) (Thread)

	Re: Did it right this time! ex_trollop527 2013-01-08 07:14 pm UTC (link)
	No worries! Question though - this only makes the icons on my FP round, but the default one on my journal is still square. What am I doing wrong? (Reply to this) (Parent) (Thread)

	Re: Did it right this time! tessisamess 2013-01-09 01:09 pm UTC (link)
	Hokai, so I went in and learned to do it. To make the default icon round, we put this in the CSS: `table table table img{ -webkit-border-radius: 50px; border-radius: 50px; }` It's going to leave a square BG color behind it, though, so in custom colors under Look and Feel you need to blank out Page Background. (Reply to this) (Parent) (Thread)

	ex_trollop527 2013-01-09 06:59 pm UTC (link)
	You're awesome! Thank you. (Reply to this) (Parent) (Thread)

	tessisamess 2013-01-09 07:06 pm UTC (link)
	Aww, no prob bb! Sorry for the initial confusion on which pic you wanted to change. XD (Reply to this) (Parent)