Плавающие DIVs добавляют дополнение к нижней части

#html #css

#HTML #css

Вопрос:

Возникла странная проблема с плавающими divs с цветами фона.

Мы разработали div, чтобы имитировать функциональность баннера для клиента. Баннер может быть выровнен по левому / правому краю текста или нет.

Когда баннер не выровнен, баннер выглядит так, как должен. Однако дополнительные отступы добавляются, когда баннер перемещается влево / вправо.

 Here's an example - http://jsfiddle.net/ZSE93/
  

Если у вас есть какие-либо идеи, это было бы здорово. Или, если у вас есть какие-либо вопросы, я с радостью их объясню.

Приветствия

Комментарии:

1. И в чем ваш вопрос????

2. Вопрос, по-видимому, заключается в том, как предотвратить вставку дополнительного дополнения в основание div, которое перемещается вправо. Сейчас я его проверяю.

3. Да, Мариус, это правильно. Извините, что не объяснил это подробно, сегодня утром у меня был небольшой туман в голове :-

Ответ №1:

это связано margin-bottom с внутренним p, ниже приведены два варианта исправления этого

 .banner p {
    font-size: 12px;
    margin-bottom: 0;
}
  

или

 .banner p {
    font-size: 12px;
    display: inline-block;
}
  

И скрипка, показывающая исправление.

Комментарии:

1. Ну, я чувствую себя немного толстым! Должен был заметить это. Спасибо 🙂

Ответ №2:

вы имеете в виду этот пример

 .banner{
  float:right;
}
  

http://jsfiddle.net/kisspa/5dgFv/