Thought I would show you how to change the Poster area. (Both in posts on the forum and in the PM area) This is one of a couple of ways I'll show you to do this.
Modify your css via Style Manager.
Look for this in the css:
/* poster and postarea + moderation area underneath
*/
.post_wrapper
{
float:left;
width:100%;
}
.poster
{
float:
left;
width: 15em;
}
.postarea,
.moderatorbar
{
margin: 0 0 0 16em;
}
.postarea
div.flow_hidden
{
width: 100%;
}
.moderatorbar
{
clear: right;
}
/* poster details and list
of items */
.poster h4, .poster ul
{
padding: 0;
margin:
0 1em 0 1.5em;
}
.poster h4
{
margin: 0.2em 0 0.4em
1.1em;
font-size: 120%;
}
.poster h4, .poster h4
a
{
color: #c06002;
}
.poster ul ul
{
margin:
0.3em 1em 0 0;
padding: 0;
}
.poster ul ul
li
{
display: inline;
}
.poster li.stars, .poster li.avatar,
.poster li.blurb, li.postcount, li.im_icons ul
{
margin-top:
0.5em;
}
Replace with this:
(be VERY careful that you copy and replace the exact code - no more/no less)
/* poster and postarea + moderation area underneath */
.post_wrapper
{
float:left;
width:100%;
}
.poster
{
float: left;
width: 12em;
background: #ffffff url(http://i148.photobucket.com/albums/s20/smfstyles/imbg.png)repeat-x left bottom;
border: 1px solid #D7D7D7;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
text-align: center;
margin-left:10px;
padding: 4px;
position: relative;
z-index: 49;
}
.postarea, .moderatorbar
{
margin: 0 0 0 18em;
}
.postarea div.flow_hidden
{
width: 100%;
}
.moderatorbar
{
clear: right;
}
/* poster details and list of items */
.poster h4, .poster ul
{
padding: 0;
margin: 0 1em 0 1em;
}
.poster h4
{
margin: 0.4em 0 0.4em 1.1em;
font-size: 110%;
text-align:left
}
.poster h4, .poster h4 a
{
color: #c06002;
}
.poster ul ul
{
margin: 1em 1em 0 0;
padding: 0;
}
.poster ul ul li
{
display: inline;
}
.poster li.gender, .poster li.stars, .poster li.avatar, .poster li.blurb, li.postcount, li.im_icons ul
{
margin-top: 1em;
}
If you are using a custom stylesheet and want to change how it looks look for this in the code:
.poster
{
float: left;
width: 12em;
background: #ffffff url(http://i148.photobucket.com/albums/s20/smfstyles/imbg.png)repeat-x left bottom;
border: 1px solid #D7D7D7;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
text-align: center;
margin-left:10px;
padding: 4px;
position: relative;
z-index: 49;
}
To change the small image that is at the bottom replace the url in this with your own image. The image is 13px x 31px.
:
background: #ffffff url(http://i148.photobucket.com/albums/s20/smfstyles/imbg.png)repeat-x
left bottom;
To remove the background image at the bottom of the block completely replace that line of code with:
background: #ffffff;
To change the background color of the block replace #ffffff in the above code
To change the border color of the block change the color code in this part of the code:
border: 1px solid #D7D7D7;