Quote:
Why does it happen
Your browser treats the line break as whitespace: not as a line break, but as a space.
A simple example to prove this:
a
b
The above code returns
a b in the browser, however, if you remove the line break, then the code is this:
ab
And the above code returns
ab in the browser.
Quote:
how to avoid those spaces?
Add
float: left; to every style attribute:
<div style="margin: 0; display: inline-block; float: left;">first div</div>
<div style="margin: 0; display: inline-block; float: left;">second div</div>
Note: I suggest to create a CSS class instead of using the
style attribute.
In your
<head> tag, add this
<style> tag:
<!--
<style type="text/css">
div.nospaces {
margin: 0;
display: inline-block;
float: left;
}
</style>
And now when creating your
div, use
class="nospaces" instead of
style="...":
<div class="nospaces">first div</div>
<div class="nospaces">second div</div>
Submit an article or tip