Плавание создает перекрывающиеся отделения

Я столкнулся с тем же вопросом, и простой ответ:

  • $ this требует экземпляра класса
  • self :: не

Всякий раз, когда вы используете статические методы или статические атрибуты и хотите вызывать их, не создав объект, экземпляр которого вы создали нужно использовать self :: для их вызова, потому что $ this всегда требует создания объекта.

10
задан KyleMit 6 November 2013 в 18:35
поделиться

5 ответов

Вам необходимо использовать clear-fix. Вставьте следующее после вашего плавающего div и внутри содержащего div.

<div class="clear"></div>

И добавьте следующий стиль:

.clear { clear:both; }

Пример:

<div class="container">
  <div class="floatedDiv">Hello World</div>
  <div class="clear"></div>
</div>
28
ответ дан 3 December 2019 в 13:37
поделиться

Если вы не хотите добавлять дополнительную разметку в HTML-код или увеличивать ширину внешнего div, вы можете использовать:

#div1 {
    overflow:hidden;   /* clears float for most browsers */
    zoom:1;            /* clears float for IE6           */
    }
8
ответ дан 3 December 2019 в 13:37
поделиться

Maybe handy to note that there is also the well know clearfix code from positioniseverything that is written specifically for this problem and is probably most robust and easiest to apply in any situation. The CSS looks as follows:

<style>
div.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
div.clearfix { display: inline-block; margin: 0 0 8px 0; }
/* Hides from IE-mac \*/
* html div.clearfix { height: 1%; }
div.clearfix { display: block; }
/* End hide from IE-mac */
</style>

In order to use it in your situation you would do the following:

<body>
<div id="div1" class="clearfix" >Inner Div:
<div id="div2">Testing long content.</div>
</div>
</body>
5
ответ дан 3 December 2019 в 13:37
поделиться

(в третий раз сегодня :-)) дает переполнение внешнего div: hidden;
и ширина.

2
ответ дан 3 December 2019 в 13:37
поделиться

Хотя приведенные выше решения должны работать, я считаю, что стоит указать на один волшебный трюк, который я еще не видел. (в этой теме).

Просто поместите # div1 влево. Когда вы перемещаете родительский элемент, он автоматически очищает дочерний элемент - что действительно полезно. Вы можете построить целую компоновку плавающих стеков, а затем сделать одну последнюю очистку в конце, и это будет довольно надежно.

1
ответ дан 3 December 2019 в 13:37
поделиться