How can I get rid of the space between the built-in DIVs

Question

I have the following code (on the xhtml page)

<div style="background-color:#006400;">
    <div id="div1" style="display:inline-block; background-color:#7fffd4;">Content 1</div>
    <div id="div2" style="display:inline-block; background-color:#deb887;">Content 2</div>
</div>

There is a space between div1 and div2. I set the margins, indents, borders to zero, but the result is the same in IE8, Firefox 3.6.13 and Opera 11. Is there a way to get rid of this interval?

Thanks in advance.

Answer 1

you should try to remove the spaces (character) between them. (built-in elements similar to words)

Answer 2

Remove the space between # div1 and # div2

<div style="background-color:#006400;">
    <div id="div1" style="display:inline-block; background-color:#7fffd4;">Content 1</div><div id="div2" style="display:inline-block; background-color:#deb887;">Content 2</div>
</div>

The space character that you get is the result of the correct layout of the source code with indentation and newlines.