导航栏错位，添加如下代码后导航少了10px是什么情况啊？怎么解决？
添加如下代码后，
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
变为下图，少了10px?这是什么情况？怎么解决？
导航部分css码如下：
.nav{
height: 40px;
}
.nav_left{
width: 10px;
background: url(../img/nav_left.jpg) no-repeat;
}
.nav_mid{
width: 980px;
background: url(../img/nav_bg.jpg) repeat-x;
}
.nav_right{
width: 10px;
background: url(../img/nav_right.jpg) no-repeat;
}
.nav_left,.nav_mid,.nav_mid_right{
float: left;
height: 40px;
}
