thadeuszlay thadeuszlay - 7 days ago 4x
CSS Question

What is the space between the sections in HTML?

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>
<section id="sect1" name="lvl1">
<div id="divLvel1" class="level one">
<div id="panel_lvl1">
<section id="sect2" name="lvl2">
<section id="sect3" name="lvl3">
<div id="divLvel3" class="level three">
<div id="panel_lvl3">
<div id="chart3">
<section id="sect4" name="lvl4">
<div id="divLvel4" class="level four">
<div id="panel_lvl4">
<div id="chart4">

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?


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

* {

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