CSS BFC haslayout Model

Source: Internet
Author: User
Tags css validator

BFC (Block formatting Context), simply put, it provides an independent layout of the environment, each BFC compliance with the same set of layout rules. For example, within the same BFC, the box will be a row next to each other, the spacing of the adjacent boxes is determined by margin and the vertical margin will overlap. Float and clear float are also valid only for elements within the same BFC.    Non-block box floating elements, absolute positioning elements and block-level containers (such as inline-blocks,table-cells and Table-captions), and the overflow attribute is a block-level box of any value other than visible, will create a BFC. That is, when the element CSS property is set to one of the following, you can create a bfc: float:left|rightposition:absolute|fixeddisplay:table-cell|table-caption| Inline-blockoverflow:hidden|scroll|auto ie Haslayout is an intrinsic property of the IE browser engine, which can affect the positioning of elements and the interaction between elements. When the Haslayout property of an element is true, this element can determine the layout of itself and its descendant elements.   Therefore, when it is found that some elements of the layout under IE have an exception, there can be good reason to suspect that the Haslayout property may be false. And this property value cannot be set directly. An element is either owned by default or obtained by setting a specific CSS property. The direct way to make the element Haslayout property value True is to declare one of the following CSS properties:  width: Value other than auto: value float:left|rightposition except auto: ABSOLUTEDISPLAY:INLINE-BLOCKWRITING-MODE:TB-RL (IE) Zoom: In addition to the normal value IE7 added some properties of the same effect: Min-height: Any value max-height: except " Any value other than "None" Min-width: Any value max-width: Any value other than "None" Overflow:hidden|scroll|autooverflow-x: hidden|scroll| Autooverflow-y: hidden|scroll|autoposition:fixed  most commonly used is zoom:1, because this setting has no effect on the appearance of the element. However, this property is specific to IE CSS properties, not through the CSS checker provided by the CSS validator (of course, let not let the verification by the actual rules depending on the various validators).

CSS BFC haslayout model

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.