What is the space between the sections in HTML?

css, html

Solution

reset padding and margin for all objects at the start of your style

* {
margin:0;
padding:0;
}

after that you can set padding and margin as you want for each object

Problem

I've got this HTML structure: ``` <body cz-shortcut-listen="true"> <div id="panels"> <section id="sect0" name="lvl0"> <div id="divLvel0" class="level zero"> <h2>top<nav><ul><li><a href="#sect1">Languages</a></li><li><a href="#sect2">Proficiency</a></li><li><a href="#sect3">Milestones</a></li><li><a href="#sect4">Details</a></li></ul></nav></h2> </div> </section> <section id="sect1" name="lvl1"> <div id="divLvel1" class="level one"> <div id="panel_lvl1"> <h2>Languages</h2> </div> </div> </section> <section id="sect2" name="lvl2"> </section> <section id="sect3" name="lvl3"> <div id="divLvel3" class="level three"> <div id="panel_lvl3"> <h2>Milestones</h2> <div id="chart3"> </div> </div> </div> </section> <section id="sect4" name="lvl4"> <div id="divLvel4" class="level four"> <div id="panel_lvl4"> <h2>Details</h2> <div id="chart4"> </div> </div> </div> </section> </div> </body> ``` https://jsfiddle.net/thadeuszlay/Lkdo5xv3/2/ Every section touch each other directly, i.e. there is no additional element in between the sections. But somehow you can see a gap (the green background color) between each section. I already set the padding and the margin of the body to zero. Also I replaced the sections with DIVs. But the gap is still there. How do I get rid of the gap and make each section touch other without a gap between them?

Original source