Я работаю над созданием фоновых цветов с содержанием внутри них, это то, что я до сих пор придумывал с помощью других людей на этом сайте, но я столкнулся с загадкой.Когда я подключаю этот код, он создает то, что я хочу, но есть одна проблема: на границах есть пустое пространство, которое окружает цветные прямоугольники.Вверху синего прямоугольника находится небольшое пустое пространство между синим прямоугольником и верхней частью страницы, а также по краям синего / красного / зеленого прямоугольника есть небольшое пустое пространство между концом страницы и прямоугольником.как я могу изменить это, если белые пробелы заполнены соответствующими цветами.
Это всего лишь тест, и я просто возиться с ним, прежде чем вносить реальные изменения в домашнее задание.Моя цель - сделать 10% верхней части страницы определенным цветом (например, голубым), а 80% - другим цветом (посередине, например, цвета слоновой кости), а затем снизу сделать его серым.
CSS:
div {
height: 100px;
position: relative;
}
.a:after,.b:before,.c:after {
content:"";
width: 100%;
height: 100%;
top: 0;
right: 0;
display: block;
position: absolute;
}
.a {
background: blue;
}
.b {
background: red;
}
.c {
background: green;
}
HTML:
<div class="a"> </div>
<div class="b"> </div>
<div class="c"> </div>