style code background fff width 560px height 70px padding 10px border

<style>
  .code {
background: #fff;
width: 560px;
height: 70px;
padding: 10px;
border: solid 2px rgba(0, 0, 0, 0.1);
margin: 10px;
outline: none;
font-family: Tahoma;
font-size: 15px;
}
body {
background: #f1f1f1;
}
a {
color: #000;
text-decoration: none;
}
hr {
height: 0;
border: solid #506070;
border-top-width: 1px;
border-bottom-width: 0;
}
.bblist {
height: 26px;
width: 330px;
background: url("icon/bg.gif");
}
.bblist img {
margin: 4px 0px;
}
.bblist img:first-child {
  margin-left: 4px;
}
.bblist img:last-child{
  margin-right: 4px;
}
</style>
<p>
  <script> 
function tag (x, y, z) 
{ 
if (document.selection) 
   with (document.selection.createRange ()) {text = y + text + z} 
else if (x.selectionStart >= 0) with (x) 
   { 
   var u = scrollTop, v = scrollLeft, t = value, 
   s = selectionStart, l = selectionEnd - s; focus (); 
   value = t.substr (0, s) + y + t.substr (s, l) + z + t.substr (s + l); 
   selectionStart = selectionEnd = s, scrollTop = u, scrollLeft = v; 
   str = document.getElementById('txa'); 
 var text = 'Текст который необходимо вставить в текстовое поле'
 
 str.focus();
    
 var input1 = str.createTextRange();
 var input2 = input1.duplicate();
 var sel = document.selection.createRange();
 
 input1.setEndPoint('StartToStart', sel);
 input2.setEndPoint('EndToStart', sel);
 
 var str1 = input2.text;
 var str2 = input1.text;
 document.selection.createRange().text += NeedText;
 str.value =  str1 + ' ' + text + ' ' + str2;
   } 
else x.value += y + z; x.focus (); 
} 

function myFunc (y) 
{ 
var z = true, y = window.event || y, x = y.target || y.srcElement, 
w = {'66' : 'b', '85' : 'u', '73' : 'i'}; 
if (y.ctrlKey && w [y.keyCode]) 
   {z = false; tag (document.getElementById ('txa'), '[' + w [y.keyCode], '][/' + w [y.keyCode ] + ']')} 
return z; 
} 
</script>

<div class="bblist"> 
<img src="icon/b.gif"      onclick="tag (document.getElementById ('txa'), '[b]', '[/b]')" width="18" height="18" alt="Жирный CTRL+B"       title="Жирный CTRL+B"      > 
<img src="icon/i.gif"    onclick="tag (document.getElementById ('txa'), '[i]', '[/i]')" width="18" height="18" alt="Курсив CTRL+I"       title="Курсив CTRL+I"      > 
<img src="icon/u.gif" onclick="tag (document.getElementById ('txa'), '[u]', '[/u]')" width="18" height="18" alt="Подчеркнутый CTRL+U" title="Подчеркнутый CTRL+U">
<img src="icon/code.gif" onclick="tag (document.getElementById ('txa'), '[code]', '[/code]')" width="18" height="18"> 
</div><br> 

<?php
/*************************************************
/*                                               *
/*     Author: Adam Viðarsson                    *
/*     Project: Learning PHP 8)                  *
/*                                               *
/*      bbcode.php - BBCode system.              *
/*                                               *
/************************************************/
include 'bb.php';
$a = $_POST['a'];
$b = '[youtube]http://www.youtube.com/watch?v=X6os4V2Y96k[/youtube] [br] [url=http://vk.com/max.height][font=Arial]Текст, написанный [color=rgb(229, 128, 128)]шрифтом Arial[/color][/font] и [font=cursive]cursive[/font][/url]';
$c = "[b]This is bold text[/b][br]
[i]This is italic text[/i][br]
[code]This is pre-formatted text[/code][br]
[quote]This is a quote[/quote][br]
[quote='Obama']This is a quote by a specific person[/quote][br]
[size=30]This text's size is set at 30%[/size][br]
[s]This text has a strikethrough[/s][br]
[u]This text is underlined.[/u][br]
[center]This text is centered[/center][br]
[color=red]This is red text[/color][br]
[email]someone@somewhere.com[/email][br]
[email=someone@somewhere.com]An e-mail link[/email][br]
[url]http://www.google.com/[/url][br]
[url=http://www.google.com/]Google.com yo![/url][br]
[img]http://i.imgur.com/WqYEO.jpg[/img][br]
An image as a link:
[url=http://en.wikipedia.org/wiki/Ninja][br][img]http://i.imgur.com/8d7Yu.jpg[/img][/url][br]
This is an unordered list: 
[list]
[*]list item #1
[*]list item #2
[*][b]bold list item #3[/b]
[/list][br]
This is an ordered (numbered) list: 
[list=1]
[*]list item #1
[*]list item #2
[*][b]bold list item #3[/b]
[/list][br]
This is an ordered (alpha) list: 
[list=a]
[*]list item #1
[*]list item #2
[*][b]bold list item #3[/b]
[/list][br]
[youtube]http://youtu.be/DabwEqsWWiA&hd=1[/youtube][br]
[youtube]http://www.youtube.com/watch?v=DabwEqsWWiA[/youtube][br]";
$bbcode = new BBCode;
echo $bbcode->toHTML($a);  

?>
<form action="" method="POST">
 <?echo '<textarea wrap="off" id="txa" rows="10" cols="40" value=' .$a . ' onkeydown="return myFunc (event)" class="code" name="a">'.$a.'</textarea>';?>
  <button>Показать</button>
</form>