Как получить два тега div без пробелов между ними?

Question

я хочу, чтобы нижние колонтитулы были такими же, как

Когда я использую два тега div для первого и второго ряда, я получаюпробел, и он показывает, как показано ниже

<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;">AAAA</p>
    <p style="float: left; width: 33%; text-align: center;">&nbsp;</p>
    <p style="float: left; width: 33%; text-align: right;">CCCC</p>
</div>
<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;">DDDD</p>
    <p style="float: left; width: 33%; text-align: center;">EEEE</p>
    <p style="float: left; width: 33%; text-align: right;">FFFF</p>
</div>

Answer 1

Браузеры автоматически добавляют пробел (поле) перед и после каждого элемента 'p'.Поля могут быть изменены с помощью CSS (со свойствами полей).Таким образом, вы должны удалить поля тега 'p' с помощью css

p {
        margin: 0 0 0 0;
  }

<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;">AAAA</p>
    <p style="float: left; width: 33%; text-align: center;">&nbsp;</p>
    <p style="float: left; width: 33%; text-align: right;">CCCC</p>
</div>
<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;">DDDD</p>
    <p style="float: left; width: 33%; text-align: center;">EEEE</p>
    <p style="float: left; width: 33%; text-align: right;">FFFF</p>
</div>

Answer 2

Попробуйте это

<div style="width:100%; color:#4682b4;">
    <p style="float: left;margin: 0 0 0 0; width: 34%; text-align: left;">AAAA</p>
    <p style="float: left; width: 33%;margin: 0 0 0 0; text-align: center;">&nbsp;</p>
    <p style="float: left; width: 33%;margin: 0 0 0 0; text-align: right;">CCCC</p>
</div>
<div style="width:100%; color:#4682b4;">
    <p style="float: left; width: 34%; margin: 0 0 0 0;text-align: left;">DDDD</p>
    <p style="float: left; width: 33%;margin: 0 0 0 0; text-align: center;">EEEE</p>
    <p style="float: left; width: 33%;margin: 0 0 0 0; text-align: right;">FFFF</p>
</div>

Answer 3

Вы используете блочный тег 'p', который включает автоматическое поле, удалите его и увидите, что пространство уменьшится

<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;margin:0px">AAAA</p>
    <p style="float: left; width: 33%; text-align: center;margin:0px">&nbsp;</p>
    <p style="float: left; width: 33%; text-align: right;margin:0px">CCCC</p>
</div>
<div style="width:100%; clear:both;color:#4682b4;">
    <p style="float: left; width: 34%; text-align: left;margin:0px">DDDD</p>
    <p style="float: left; width: 33%; text-align: center;margin:0px">EEEE</p>
    <p style="float: left; width: 33%; text-align: right;margin:0px">FFFF</p>
</div>