Certain type of table

[yourrstrulyy]

Okay so I'm a dumb nut when it comes to codes and I was wondering what the code for v5 was for these type of tables:

        

And also whether the gender signs are other codes you have to place in? If so would someone be able to tell me those as well?
Thanks!

[Tumbleweed]

yourrstrulyy, I have this one..... 


<style>
.my_stats_pos{
width: 100%;
font-size:.6em!important;
}
.stats_classes{
float:left;
width: 70px;
padding:2px;
line-height: 12px;
margin-bottom: 3px;
}
.stats_female{
float:left;
width: 20px;
background-color: #f8e8ec;
padding:2px;
line-height: 12px;
margin-bottom: 3px;

}
.stats_males{
float:left;
width: 16px;
background-color: #f8e8ec;
padding: 2px;
line-height: 12px;
margin-bottom: 3px;
text-align:center;
}
.side_totals{
float:right;
width: 16px;
background-color: #f8e8ec;
padding: 2px;
line-height: 12px;
margin-bottom: 3px;
text-align:center;
}
.grand_total_stats{
float:right;
width: 16px;
background-color: #f8e8ec;
color: #5d4727;
font-weight: bold;
color: #ff0000;
padding: 2px;
line-height: 12px;
margin-bottom: 3px;
text-align:center;
}
.male_image{
background-image:url(http://images.proboards.com/v5/images/icons/male.png);
background-repeat: no-repeat;
float:left;
width:14px;
height:14px;
margin-left:1px;
}
.fem_image{
background-image:url(http://images.proboards.com/v5/images/icons/female.png);
background-repeat: no-repeat;
float:left;
width:16px;
height:16px;
margin-left:1px;
   
}
</style>


<div class="my_stats_pos">
<div class="stats_classes" style="border-left: 6px solid #353955;">Low-Class</div>
<div class="fem_image"></div><div class="stats_female">03</div>
<div class="male_image"></div><div class="stats_males">01</div>
<div class="side_totals"><center>04</center></div>
<br />

<div class="stats_classes" style="border-left: 6px solid #151a42;">Middle-Class</div>
<div class="fem_image"></div><div class="stats_female">06</div>
<div class="male_image"></div><div class="stats_males">04</div>
<div class="side_totals"><center>10</center></div>
<br />

<span style="font-family: Verdana, Arial; font-size: 10pt;"><div class="stats_classes" style="padding-left:8px;border:none;"><b>Total</b></div> </span>
   <div class="fem_image"></div><div class="stats_female"><b>20</b></div>
   <div class="male_image"></div><div class="stats_males"><b>15</b></div>
   <div class="side_totals"><b>10</b></div>
   <br />

<div class="stats_classes" style="padding-left: 6px; border: none; font-weight: bold;">Grand Total</div>    
<div class="grand_total_stats">25</div>
</div>

....that is more like the first one you posted if you still need this. If you have side bar redux plug-in you can just add it to the content of one of your boxes.

[yourrstrulyy]

Thanks Tumbleweed! Using it on my forum