Author Box

author box stylish by mbah siyam

by Farrij Annafiu

HTML

<div class="siyam-about">
<div class="siyam">
<span style="font-family: Verdana,sans-serif;"><img height="80" src="http://i.imgur.com/Xd8GR.png" width="80" /> <b>Namamu</b> (Author) </span></div>
<div class="siyam-text">
<span style="font-family: Verdana,sans-serif;"><span style="font-size: large;"><b>About The Author: </b></span></span><br />
<span style="font-family: Verdana,sans-serif;"><br /></span>
<span style="font-family: Verdana,sans-serif;">Lorem ipsum dolor sit amet, choro dignissim assueverit in qui, ex laboramus torquatos eos, eius omnes primis pro eu. His falli</span><br />
<span style="font-family: Verdana,sans-serif;">Namamu di:
<b><a href="#">Twitter</a></b>|<b><a href="#">Facebook</a></b>|<b><a href="#">Google+</a></b></span></div>
</div>

CSS

.siyam-about img {
margin:0;
border:0;
}
.siyam-about {
font-size:12px;
margin:0 auto;
padding:10px;
width:100%;
background:#E4E4E4;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-webkit-box-shadow:inset #222 0 2px 8px;-moz-box-shadow:inset #222 0 2px 7px;width:auto;text-shadow:1px 0 0 #fff;margin:0 0 5px;padding:10px
border:#BBBBBB solid 1px;
min-height:130px;
}
.siyam {
padding-top:10px;
margin:0;
font-size:12px;
float:left;
width:17%;
text-align:center;
border-right:#063584 solid 1px;
}
.siyam-text {
float:right;
width: 80%;
padding:5px;
text-align:left;
font:12px arial,sans-serif;
text-align:justify;
margin:0;
padding:0;
}