Удалить пробел между divs

Ответ 1

Вы получаете пробел, потому что у вас есть пробел между div. Пробел между встроенными элементами интерпретируется как пробел.

У вас есть:

<div id="left_side">
    <div id="plan">
        <h1>div 1</h1>
    </div>
</div>
<div id="right_side">
    <div id="news">
        <h1>div 2</h1>
    </div>
</div>

Изменить для:

<div id="left_side">
    <div id="plan">
        <h1>div 1</h1>
    </div>
</div><div id="right_side">
    <div id="news">
        <h1>div 2</h1>
    </div>
</div>

Однако это плохой способ сделать то, что вы хотите сделать.

Вы должны плавать элементы, если это то, что вы хотите сделать.

Ответ 2

Использование:

float:left;
clear:none;  

В обоих div

Ответ 3

Если вы хотите сохранить свой макет кода, избегайте поплавков и сохраняйте каждый div на своей собственной линии полностью...

<div id="leftSide">Some content here</div><!-- --><div id="rightSide">Some more content here</div>

Ответ 4

Это трюк:

<div id="left_side">
    ...
</div><div id="right_side">
    ...
</div>

Обратите внимание, как правый div начинается сразу после закрывающего тега левого div. Это работает, потому что любое пространство между элементами, поскольку они теперь встроены, станет пространством в самой компоновке. Вы можете отразить это поведение с помощью двух элементов span.

Демо.

Ответ 5

Добавьте это в свой CSS

h1 {
    padding:0;
    margin:0;
   }

Пробел между div только из-за h1 Margin и Padding

Ответ 6

Плавающий оба оставшихся элемента также составил 30% ширины на 40%, чтобы заполнить все пространство, но это не обязательно. Помните, что "встроенный блок" не поддерживается IE7, но может быть исправлен с обходом.

http://jsfiddle.net/RVAQp/3/

Ответ 7

Переместите эти выражения в одну строку:

</div><div id="right_side">

Ответ 8

Пробовал использовать float вместо "inline-block", никаких проблем. Просто изменил отображение: встроенный блок:

#left_side {float: left;}

и

#right_side {float: right; margin-right: 10%}

Нет очевидных проблем. Неверно.

Ответ 9

Не знаю, почему, но я решил эту проблему, добавив border: 1px solid red; (вертикальный) и float: left; (по горизонтали) в соответствующий оператор стиля DIV и удаленные пробелы.

Ответ 10

Вы также можете добавить display: flex; в родительский контейнер div (в данном случае это body). Скрипка