CSS
Blokuj formatowanie kontekstów

Angular 2 AngularJS ASP.NET HTML JavaScript jQuery PHP SVG twitter-bootstrap WordPress
Szukaj…


Uwagi

[Kontekst formatowania bloku jest częścią wizualnego renderowania CSS strony internetowej. Jest to region, w którym występuje układ pól blokowych i w których elementy pływające oddziałują na siebie.] [1]

[1]: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_formatting_context MDN

Korzystanie z właściwości przepełnienia o wartości innej niż widoczna

img{
  float:left;
  width:100px;
  margin:0 10px;
}
.div1{
  background:#f1f1f1;
  /* does not create block formatting context */
}
.div2{
  background:#f1f1f1;
  overflow:hidden;
  /* creates block formatting context */
}

wprowadź opis zdjęcia tutaj

https://jsfiddle.net/MadalinaTn/qkwwmu6m/2/

Użycie właściwości przepełnienia o wartości innej niż widoczna (jej wartość domyślna) spowoduje utworzenie nowego kontekstu formatowania bloku. Jest to technicznie konieczne - jeśli liczba zmiennoprzecinkowa przecina się z elementem przewijającym, wymusiłaby zawinięcie zawartości.

Ten przykład pokazujący, w jaki sposób kilka akapitów będzie oddziaływać z pływającym obrazem, jest podobny do tego przykładu na css-tricks.com.

2 : https://developer.mozilla.org/en-US/docs/Web/CSS/overflow MDN



Modified text is an extract of the original Stack Overflow Documentation
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow