Lining up links in sidebar, changing text colors and the eternal security icons issues

[la_petite_singe]

Name of journal: la_petite_singe
Layout Style: Flexible Squares; customized layout from mintyapple
Basic, Paid or Plus: Paid
Problem you are having: I'm trying to rearrange the links on the righthand side into a neat list (like, one per line); I'm trying to change the color of bolded font (especially when using a numbered list, if possible) and the userinfo/entry security

Comments

[fencer_x]

Do you use Firebug? Not sure what tutorials you've looked at, but it's pretty clear from using Firebug that you're not using the correct URLs for the security icon replacement code. For example, the userinfo URL is now "http://l-stat.livejournal.com/img/userinfo.gif?v=1", but you use, "http://l-stat.livejournal.com/img/userinfo.gif"

If you don't use Firebug, I definitely recommend using it. It'll show you when code like that changes, as Livejournal seems to like doing a lot ^^;

[la_petite_singe]

I don't use Firebug--I'm actually not even sure what it is, TBQH--but I did read that "?v=1" elsewhere and I tried inserting it, but it doesn't help. :P Thanks, though!

[fencer_x]

It's an extension for firefox and absolutely indispensable when coding CSS :) It shows exactly which code to change where (there are similar built-in apps for Chrome and Safari IIRC) to achieve certain CSS effects.

The ?v=1 works fine for me and everyone else whose asked for help, so that's definitely what you need :/ You're possibly not inserting it in all the correct places? IIRC there are two userinfo URLs you have to change.

[la_petite_singe]

I'll give it a try, thanks! :) I think I'm putting it in the right place, it's just that something else has gone wrong. :P I'll keep fiddling with it.

Try this

[anarano]

links on the righthand side

Search in your CSS for this:

li.sbaritem {
margin: 0px 6px 0px 3px;
padding: 0px 0px 5px 0px;
list-style: none;
display: inline;
}

Delete the bold part.

colored bold font

Search for this:

b, s, u, i, strong, em {
color: #A0156A;
}

You can either delete the whole section or edit it separately, and put some lines after the piece of code above, e.g.:

b {color: #000}
s {color: #fff}
u {color: #aaa}
etc.

b = bold
s = strikeout
u = underline
i = italic
strong = usually bold
em = usually italic

#000=black
#fff=white
#aaa=grey

icons

Move/copy the whole tiny icons code section from the end at the start of your CSS, that should do the trick.

Good luck!
Ana

Re: Try this

[la_petite_singe]

Yay, thank you so much! That was very helpful. :) I'm still having a little trouble with the bold/italic/etc font, though--where are those codes supposed to go? I think I put 'em in the wrong spot.

EDIT: And for some reason, the userinfo/community icons are working, but not the 'lock' security one. :P Sorry to be annoying, but I can't figure out why it's just that one!

Re: Try this

[anarano]

It's always the best to put new code parts at the place of the old one. Or alternatively at the end (or start) of the CSS. But be careful with the brackets; you are having problems because you've put the bold/italic code into another code part:

B O D Y

{

margin-left: ;
background-color: #ffffff;
background-image: url('http://img404.imageshack.us/img404/3783/39483737.png');
background-repeat: repeat-x;
background-position: top center;
background-attachment:scroll;
text-align: left;
font-size: 8pt;
color: #404040;
font-family: "Trebuchet MS", sans-serif;
b {color: #A0156A}
s {color: #404040}
i {color: #404040}
u {color: #404040}
strong {color: #A0156A}
em {color: #A0156A}

}

That's a no go. The bold lines (in the quote above) have to go after a closing bracket. BTW: It could be necessary to complement the code line "strong {color: #A0156A}" like this: "strong {color: #A0156A !important

Re: Try this - The devil is in the detail.

[anarano]

Search for this line in your CSS:

.ljuser img[src="http://l-stat.livejournal.com/img/icon_protected.gif?v=1"] { width: 0px;

Delete at the line start ".ljuser", delete towards the end "?v=1". Do not delete anything else.

The problem is, that each part of a html site has it's own identification tag, ids and classes. So you have a lot of combination possibilities to adress a certain section (e.g. a large sidebar or just a word). And sometimes you get lost...
LJ community and journal links (including the small pics) have the class "ljuser", the protected entries do not.

That's it - Have a nice time!
Ana