29 HTML & CSS div columns design with percentage

The task is to create three divs, that will be next to each other, and that there will be an equal space between them: in order to achieve this goal, we will use relative values, percentages (%) Elements that receive values ​​in percentages refer to the element that contains them, therefore if we create three divs inside the body which is basically the entire site (100%) the div will be relative to it If we talk mathematically: I want a margin between one div and another of 5%, that is, if I want it to be like this between the extreme left div, and the middle div, and the extreme right div, we can use margin-right: 2.5%; margin-left: 2.5%; A quick calculation shows that the margins take up 20%, well 20%-100% leaves us with 80% for the three divs, dividing 80 by 3 comes out to 26.6 Therefore each div will get a width of 26.6% div { display: inline-block; width: 26.6%; height: 300px; margin-right: 2.5%; margin-left: 2.5%; border: 1px solid purple; text-align: center; }