display:inline-block; で横並びにしたときの空白を消したい

http://naoyu.net/css/css-inline-block-space/274/

<div class="oya">

<div class="kodomo"> ~~~~~ </div>
<div class="kodomo"> ~~~~~ </div>

</div>


.oya{
letter-spacing:-0.4em;
}
.kodomo{
letter-spacing:normal;
}

htmlのdivを詰めたりコメントアウトを足したり、フォーマットしちゃたらおじゃんになっちゃいそうです。
だからcssだけでできるこの方法がいいと思います。