JS收缩菜单栏

我写了一段JQuery代码，如下：$("#hide_show").click(function(){
alert($("#menu").css("width"));//300px
alert($("#menu").css("left"));//0px
if( $("#menu").css("left")=="0px" )
$("#menu").animate({left:'-28%'},"normal",moveOtherDiv);
else
$("#menu").animate({left:'0px'},"normal",moveOtherDiv);
});

function moveOtherDiv()
{
alert("@@@@@@@@@");
alert($("#menu").css('left'));
if($("#menu").css('left')=="-28%")
{
                        //Never reach here!!!
$("#tabs").css("width",'98%');
$("#tabs").css("left",'2%');
}
else
{
$("#tabs").css("left",'30%');
$("#tabs").css("width",'70%');
}
}(hide_show)按钮用于折叠菜单栏。初始状态下菜单栏left属性是零。body width和height都是1000px。当我按下按钮后，按说（menu）菜单栏的left属性应该为-280px吧？但是在moveOtherDiv()打印出的结果却是-284px，不知道哪里多出的这4px？
请大家帮忙参谋一下，如果我没说清楚，请Q联系我：1640285302.一样给分儿哈JQuerymenu