http://jsfiddle.net/AWMMT/1/

<div>...</div><div>...</div>
              ^
              |--- 这里没有空格或换行符。

Your spaces are line breaks that the browser converts into "spaces" when displayed.

Or you could try using CSS to make some small adjustments:

A flexbox will conveniently ignore spaces between its child elements and will be displayed like a continuous inline-block element.

http://jsfiddle.net/AWMMT/470/

body { display: flex; flex-wrap: wrap; align-items: end; }

Spaces in HTML. There are several possible solutions. From best to worst:

1. Remove actual whitespace in the HTML (ideally the server can do this for you when serving the file, or at least your input template can add whitespace appropriately) http://jsfiddle.net/ AWMMT/2/
2. Use float: left instead of display: inline-block, but this will have a bad effect on the height: http://jsfiddle.net/AWMMT/3 /
3. Set the font-size of the container to 0 and the appropriate font-size for the inner elements: http://jsfiddle.net/AWMMT/4 / - This is very simple, but you can't take advantage of relative font size rules (percentage, em) on inner elements