Question about CSS

[the100yen]

I have arranged few icons in my message template

You can see everything is in correct spot



however if I post long comment, it will look like below

I am not sure how css needs to be configured

Below are my css which is in my Extra.css

.icons { * This is the icon in orange

background-color: #f56a00;
float: left;
padding: 10px;
margin-top: 10px;
　height: auto;
width: auto;
margin-left: 40px;
font-size: 15px;
border-radius: 10px;
-moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px#888;
box-shadow: 0 0 5px 5px #888;

}

.PSN {

float: left;
padding-top:60px;
margin-left: -225px;
}

.twitter {

float: left;
padding-top:60px;
margin-left: -190px;
}

.facebook {

float: left;
padding-top:60px;
margin-left: -155px;
}

 

[Paul B]

Remove the float:left

 

[the100yen]

if I take out the float:left from .icons and .PSN I will get this below

 

[Paul B]

You need to move the icons to within the message div then.

 

[the100yen]

Thank you, I move the items to message div and everything is fine!

 

[the100yen]

Also how do I change the font-size of the username in message user block?
I am also wanting to change the width of the message user block........I have no idea....