Харт, ну поправь, а
ибо плашка уменьшается
хотя у меня вообще большой подзатыльник на тему плашек разного нафиг размера
шо за криволапство........

img.a-info {
    margin: 0 -12px!important;
    position: relative!important;
    width: 214px;
    max-width: 214px;
    height: auto;
}

и подложки присунь под тот же спойлер, а то текст висит в воздухе

#font-area, .popup_graffiti, #size-area, #image-area, #color-area, #addition-area, #video-area, .punbb select, #table-area, #smilies-area, #imageup-area, #imageattach-area, #keyboard-area, #spoiler-area {.....

ну и раз я залезла...
Код:
<!----------------------------------------- ОБТЕКАНИЕ КАРТИНОК
--------------------------------------------------------------------------------------------------------------------------------------------->
<script language="javascript">
$(function(){
$('td#button-link').before('<td id="floatbut" style=\'background-image:url("https://i.imgur.com/CKOuecY.gif")\'></td>');
$('#floatbut, .vibor').click(function(){
$('div#float').toggle();});
  });
elm=document.getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content") 
{
post = elm[x].innerHTML;
if(post.indexOf("[/float]") != -1) {
floats = /\[float=(.*?)\]([^\[]{1,11000})\[\/float\]/gi
elm[x].innerHTML = elm[x].innerHTML.replace(floats, "<span style='float: $1; margin-left: 8px; margin-right: 8px; text-align: $1;'>$2</span>")
}}
</script>
<div id="float" style="display:none;background: rgb(188 184 178); border: 1px solid #7f7c7a; width: auto; padding: 4px; position: absolute; margin-top: -604px; margin-left: 300px; z-index: 20; display: block;"><div><strong>Направление обтекания</strong></div><br>
<div align="center">
<img class="vibor" src="http://s001.radikal.ru/i193/1009/96/695abc799ddb.png" title="left" onclick="bbcode('[float=left]', '[/float]')" />
<img class="vibor" src="http://s002.radikal.ru/i199/1009/ac/95c10fcc7d82.png" title="right" onclick="bbcode('[float=right]', '[/float]')" />
</div></div>