10/14 Photoshopで縦ボタンを作る

サイズ　横200px　縦50px*5

• シェイプツールの長方形ツールで数値指定して長方形を作る。
• 文字、グラデーション等を決めたものを、グループ化して複製する。
• キーボード矢印で１px移動、shift&矢印で１０px移動。

再度自宅で作ったけど、やはり切り抜きの段階で縦横１px余白が出来る。
環境設定を見てみたけどそれらしき設定は無いような感じです・・・・
う〜〜ン何故だろう？？？？

CSS

@charset"UTF-8";

/*reset*/
html,body,div,ul,li, {
  margin: 0;
  padding: 0;
}

ul {
  list-style-type: none; 
}

a {
  text-decoration: none;
}

img {
  border: 0;
}

em {
  visibility: hidden;
}

/*nav*/

#nav {
  width: 200px;
  height: 250px;
  margin: 50px 0 0 50px;
}

#nav li a {
  width: 200px;
  height: 50px;
  display: block;
  background-color: #fff;
  background-image: url(../images/d.jpg);
  background-repeat: no-repeat;
  background-position: 0 0;
}

/*indevidual*/

#nav li#home a {
  background-position: 0 0;
}
#nav li#home a:hover,li#home a:active {
  background-position: -220px 0;
}

#nav li#cafefood a {
  background-position: 0 -50px;
}
#nav li#cafefood a:hover,li#cafefood a:active {
  background-position: -220px -50px;
}

#nav li#drinkcafe a {
  background-position: 0 -100px;
}
#nav li#drinkcafe a:hover,li#drinkcafe a:active {
  background-position: -220px -100px;
}

#nav li#infomation a {
  background-position: 0 -150px;
}
#nav li#infomation a:hover,li#drinkcafe a:active {
  background-position: -220px -150px;
}

#nav li#contact a {
  background-position: 0 -200px;
}
#nav li#contact a:hover,li#contact a:active {
  background-position: -220px -200px;
}