Userpics in comments and on friends page - SOLVED

[coolceruleanblu]

Help! I'm sorry if this has been posted before, but I swear I checked and couldn't find this in the help pages. Because I was told my post was all over the place, I'm editing the wording of it.

SOLVED - What I need help with: When I view a friends entry "Leave a Comment" page the icon ends up being way far away from the entry. It's supposed to be closer to the text. If you look at my regular page coolceruleanblu.livejournal.com, you can see the usericon is supposed to be nearly flush against the entry (about 2px away), but for some reason, when I go to the Leave a Comment page, it adds like an extra icon's worth of space in there. - SOLVED



Let me show you an image:



--------------------------
BELOW IS SOLVED
I'm having my icons float to the right. And I noticed that their margins keep differing just slightly....it kind of really upsets me, because I worked forever, and I thought it had been perfect, but then I had to change the size a bit, because I noticed that some comms had images that were just a bit too large (ugh annoying) so I had to change it so it wouldn't look ugly :(.

Anyways, Long story short, I changed it. And now it seems that the userpics spacing/margin seem to vary slightly. I thought this may have been an issue with the tags running too long, but I 'fixed that' and now it seems like that is not the case. Soooo... does anyone have any advice? I think it may have to do with the usernames being too long? But I'm not sure how to fix that (should I just expand the padding around the icons?).
SOLVED. I just made the font smaller, I was right usernames were too long.

Below is my CSS. Thank you again for any help you can give!

/* */

a, a:link, a:visited {
color: #6B04CC;
}

a:hover {
color: #02AD24;
text-decoration: underline;
}

b {
color: #12A0FF;
}

blockquote {
background-color: #F8FABB;
border-radius: 10px;
-moz-border-radius: 10px;
color: #0B5402;
padding: 5px;
font-size: 11px;
}

body {
background: url('http://img.photobucket.com/albums/v654/coolceruleanblue/LJ/background.png');
background-color: #729dff;
color: #02395E;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 20px 0 20px 0;
text-align: center;
}

.box {
border-top: 1px solid #8CD2E6;
border-width: 1px 0px 0px 0px;
padding: 10px;
clear: auto;
}

.clear {
height: 15px;
}

code {
background-color: #cceeff;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
}

.commentbox {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
padding: 10px;
margin: 10px;
}

.commentboxpartial {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
padding: 10px;
margin: 10px;
}

.commentinfo {
background-color: #BBD4FA;
margin-top: 10px;
width: 630px;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "Verdana", sans-serif;
color: #02395E;
}

.comments {
background: url('http://img.photobucket.com/albums/v654/coolceruleanblue/tumblr/bgstripe.png');
background-color: #0d4da1;
border: solid #012042 1px;
-moz-border-radius: 15px 60px 15px 60px;
border-radius: 15px 60px 15px 60px;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-color: #3BDEFF;
height: 35px;
padding: 0px 5px 0px 5px;
position: relative;
text-align: right;
top: 15px;
}

#content {
background-color: transparent;
border-color: transparent;
margin-left: auto;
margin-right: auto;
padding: 15px;
position: relative;
width: 950px;
}

.currents, .currentmood, .currentmusic, .currenttags {
font-family: "Verdana", sans-serif;
font-size: 11px;
margin-right: -50px;
}

.date {
color: #95FF6B;
line-height: 200%;
margin-bottom: -15px;
margin-right: 15px;
font-family: "Verdana", sans-serif;
font-size: 9px;
text-align: right;
top: 5px;
}

.datesubject {
background: url('http://img.photobucket.com/albums/v654/coolceruleanblue/tumblr/bgstripe.png');
background-color: #0d4da1;
border-radius: 15px;
-moz-border-radius: 15px;
border: solid #012042 1px;
height: auto;
margin-left: -10px;
padding: 5px;
width: 640px;
}

.datesubjectcomment {
background-color: #02547D;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
margin-top: 20px;
padding: 5px;
}

.defaultuserpic {
background-color: #ffffff;
border: solid #012042 1px;
-moz-border-radius: 10px;
border-radius: 10px;
margin-left: 5px;
margin-right: 5px;
margin-top: -15px;
padding: 5px;
text-align: center;
}

div.datesubjectcomment a, div.datesubjectcomment a:link, div.datesubjectcomment a:visited {
color: #95FF6B;
}

div.datesubjectcomment a:hover {
color: #C94DB7;
text-decoration: underline;
}

div.comments a {
line-height: 15px;
padding-right: 25px;
}

div.comments a, div.comments a:link, div.comments a:visited {
color: #95FF6B;
}

div.comments a:hover {
color: #C94DB7;
text-decoration: underline;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #95FF6B;
font-size: 10px;
letter-spacing: normal;
}

div#footer a:hover {
color: #C94DB7;
font-size: 11px;
letter-spacing: normal;
text-decoration: underline;
}

div#header a, div#header a:link, div#header a:visited {
color: #0490BA;
font-size: 13px;
letter-spacing: normal;
}

div#header a:hover {
color: #1CA648;
font-size: 14px;
letter-spacing: normal;
text-decoration: underline;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
color: #3EBA0D;
}

div#sidebar a:hover {
color: #C94DB7;
text-decoration: underline;
}

.entry {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 0px 10px 10px -10px;
padding: 10px;
text-align: left;
width: 630px;
}

.entry li {
background-color: #C5EBFA;
color: #7D026B;
font-size: 12px;
-moz-border-radius: 5px;
border-radius: 5px;
width:200px;
}

.entry li:nth-child(odd) {
background-color: #CAFCE2;
color: #50046E;
font-size: 12px;
-moz-border-radius: 5px;
border-radius: 5px;
width:200px;
}

.entry ol, .entry ul {
font-size: 12px;
margin:0px;
margin-left:25px;
padding:10px;
padding-left:30px;
border-left:10px solid #b2bdd1;
width:200px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#footer {
background-color: #579DFF;
border: solid #012042 1px;
border-radius: 10px;
-moz-border-radius: 10px;
font-family: "Verdana", sans-serif;
font-size: 10px;
font-weight: bold;
height: 25px;
letter-spacing: normal;
text-align: center;
width: 950px;
z-index: 100;
clear: both;
}

h2 {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
font-size: 20px;
font-weight: normal;
margin-left: 20px;
padding-left: 10px;
}

#header {
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
background-color: #cceeff;
font-family: "Verdana", sans-serif;
font-size: 12px;
font-weight: bold;
letter-spacing: normal;
padding: 10px;
position: fixed;
right: 20px;
text-align: center;
text-transform: uppercase;
top: 100px;
width: 130px;
}

#header ul {
margin: 0px;
padding: 0px;
}

#header li {
margin: 0px 0px 2px 0px;
padding: 5px 4px 3px 4px;
font size: 14px;
}

.headerimage {
position: relative;
width: 950px;
height: 357px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
background-image: url("http://img.photobucket.com/albums/v654/coolceruleanblue/LJ/headercitylove.png");
background-repeat: no-repeat;
}

hr {
border-top: #4fbff7 1px dotted;
border-bottom: #1395d6 1px dashed;
border-left: transparent;
border-right: transparent;
height: 5px;
}

input, textarea {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
}

li.sbaritem {
padding-left: 15px;
list-style: none;
}

li.sbartitle {
background: url('http://img.photobucket.com/albums/v654/coolceruleanblue/tumblr/bgpolka.png');
background-color: #579DFF;
border: solid #012042 1px;
-moz-border-radius: 10px;
border-radius: 10px;
color: #052900;
font-size: 13px;
font-weight: bold;
height: auto;
list-style: none;
margin-bottom: 10px;
margin-top: 10px;
padding: 5px;
}

li.view {
color: #0F286E;
}

li.viewing {
color: #0f286E;
}

.ljtaglist ol, .ljtaglist ul {
background-color: #729dff;
font-size: 12px;
margin:0px;
margin-left:25px;
padding:10px;
padding-left:30px;
width: 200px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.ljtaglist li {
background-color: #C5EBFA;
color: #7D026B;
font-size: 12px;
-moz-border-radius: 5px;
border-radius: 5px;
width: 200px;
}

.ljtaglist li:nth-child(odd) {
background-color: #CAFCE2;
color: #50046E;
font-size: 12px;
-moz-border-radius: 5px;
border-radius: 5px;
width: 200px;
}

.ljtags {
margin: 10px -20px 0px 0px;
background-color:#e3eaf5;
width:500px;
color: #02395E;
font-size:10px;
border:1px solid #c2cde0;
}

html body .ljuser img {
width: 0px !important;
height: 0px !important;
background-repeat: no-repeat !important;
/*so that IE users will still see an image*/
background-image: url('http://img.photobucket.com/albums/v654/coolceruleanblue/LJ/miniicon.png') !important;
padding: 16px 0px 0px 16px !important;
}

html body .ljuser img[src*="userinfo.gif"] {
background-image: url('http://img.photobucket.com/albums/v654/coolceruleanblue/LJ/miniicon.png') !important;
padding: 16px 0px 0px 16px !important;
width: 0 !important;
height: 0 !important;
}

html body .ljuser img[src*="community.gif"] {
background-image: url('http://img.photobucket.com/albums/v654/coolceruleanblue/LJ/miniicon.png') !important;
padding: 16px 0px 0px 16px !important;
width: 0 !important;
height: 0 !important;
}

#maincontent {
background-color: transparent;
border-color: transparent;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin-left: 200px;
margin-right: 0px;
margin-top: 15px;
}

p {
color: #02395E;
font-size: 11px;
}

.reply {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
font-family: "Verdana", sans-serif;
font-size: 11px;
line-height: 125%;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
position: relative;
text-align: left;
}

.replytosubject {
font-weight: bold;
}

.sbarbody {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
color: #02395E;
margin-left: 5px;
margin-right: 5px;
padding: 0px 5px 0px 5px;
}

.sbarbody2 {
padding: 0 15px 0 15px;
}

.sbarcalendar {
background-color: #cceeff;
border: solid 1px #012042;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: center;
}

.sbarcalendarposts {
background-color: #AFDBFA;
border: solid 1px #012042;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: center;
}

.sbarheader {
padding: 0px 2px 0px 2px;
}

.separator{
/* for formatting separators between entries */
height: 2px;
}

#sidebar {
background-color: transparent;
border-color: transparent;
float: left;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin-left: -7px;
margin-top: 15px;
padding-top: 15px;
position: relative;
text-align: left;
width: 200px
}

.skiplinks {
background-color: #cceeff;
border: solid #012042 1px;
-moz-border-radius: 15px;
border-radius: 15px;
margin-left: -10px;
margin-top: -15px;
padding-bottom: 4px;
padding-top: 2px;
text-align: center;
width: 640px;
}

.subcontent {
width: 630px;
}

.subject {
color: #4DAFFF;
font-family: "Verdana", sans-serif;
font-size: 20px;
font-weight: bold;
padding: 10px;
}

.subtitle{
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: normal;
top: 10px;
}

table.calendar {
-moz-border-radius: 10px;
border-radius: 10px;
margin-right: auto;
margin-left: auto;
}

table.yeartable {
-moz-border-radius: 10px;
border-radius: 10px;
margin-left: auto;
margin-right: auto;
}

table.yeartable td.yeardate, table.yeartable td.yearday {
-moz-border-radius: 10px;
border-radius: 10px;
border-width: 1px;
border-style: solid;
border-color: #012042;
text-align: center;
}

table.yeartable td.yeardate {
background-color: #cceeff;
color: #02395E;
}

table.yeartable td.yearday {
-moz-border-radius: 10px;
border-radius: 10px;
background-color: #0d4da1;
color: #4DAFFF;
text-align: center;
}

td.yearmonth {
-moz-border-radius: 10px;
border-radius: 10px;
}

td {
font-size: 11px;
}

textarea.textbox {
width: 100% !important;
}

.title {
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: normal;
line-height: 200%;
top: 10px;
}

u {
color: #13A3AB;
}

ul.navfooter{
padding: 0px;
margin: 0px;
}

ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}

.clearfoot {
clear: both;
}

ul.navheader {
padding: 0px;
margin: 0px;
}

ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}

ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}

ul.year {
text-align: center;
padding-bottom: 40px;
}

ul.year li {
display: inline;
}

.userpic {
background-color: #ffffff !important;
border: solid #012042 1px;
-moz-border-radius: 10px;
border-radius: 10px;
float: right;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 0px -130px 10px 10px;
padding: 5px;
position: relative;
text-align: center;
z-index: 15;
}

.userpiccomment {
background-color: #ffffff !important;
border: solid #012042 1px;
-moz-border-radius: 10px;
border-radius: 10px;
float: right;
left: 0px;
margin: 25px 10px -20px 10px;
padding: 5px;
position: relative;
top: -30px;
z-index: 15;
}

.userpicfriends {
background-color: #ffffff !important;
border: solid #012042 1px;
-moz-border-radius: 10px;
border-radius: 10px;
float: right;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 0px -130px 10px 10px;
padding: 5px;
position: relative;
text-align: center;
z-index: 15;
}