HTML/CSS - Przy zwiększaniu width i height <td>, width działa do pewnego momentu.

Witam, mam problem z powiekszaniem tabeli. Zwiekszam width i height każdej komórki, działa dobrze dopóki width nie dojedzie do pewnego momentu. Width zatrzymuje się w miejscu ( nie idzie dodać więcej) a height jedzie dalej oO. O co tu chodzi?
Fiddle: http://jsfiddle.net/H3W4X/ .
KOD:

 <div id="workspace">
    		
           <table id="leds" >
                <tbody id="leds_body">
                </tbody>
           </table>
	
    </div>

#workspace{
	position:absolute;
	left:200px;
	width:760px;
	height:600px;
	background:#0FF;
	float:left;
	overflow-x: auto;
	overflow-y: auto;
	background-image: url("bg.png");
    background-repeat: repeat-x;
	
}
#leds
{	
	position:relative;
	left:10px;
	margin-top: 50px;
	margin-left:50px;
	margin-right:50px;
	border-collapse: collapse;
	border: 2px solid black;
	
}

maja klasy .LED i .NOT_LED ```jquery var WH=10; $(function(){ $("#zoom-in").click(function(){ $(".LED, .NOT_LED").width((WH+1)+"px").height((WH+1)+"px"); WH=WH+1; });

	$("#zoom-out").click(function(){
		$(".LED, .NOT_LED").width((WH-1)+"px").height((WH-1)+"px");
		if (WH==5) WH=5;
		else WH=WH-1;
		
});
});	

Jak to rozwiązać?