ぼうびろく

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だけでできるこの方法がいいと思います。

上線はbox-shadow:inset 0 1px 0 0 #333;

下線はbox-shadow:inset 0 -1px 0 0 #333;

左線はbox-shadow:inset 1px 0 0 #333;

右線はbox-shadow:inset -1px 0 0 #333;

トラブル

原因

解決策