The disadvantage of using "complete" CSS

1. browser-supported inconsistencies

Browser vulnerabilities or lack of support for CSS features cause different browsers to display different CSS layouts. For example, in the older version of Microsoft Internet Explorer6.0, many of its own CSS2.0 properties were executed, distorting many important attributes, such as Width,height, and float. Many so-called CSS staff must achieve consistent layout in the most popular or popular browsers. In different browsers, it is sometimes impossible to achieve pixel-precise layout.

2, CSS does not have a parent layer selector

CSS selectors cannot provide the parent layer or inheritance of an element to conform to some level of standards. Advanced selectors (such as XPath) contribute to complex style designs. However, the performance of the browser and the problem of increasing the color-current relationship with the parent-level selector are the main reasons why CSS's working groups reject suggestions.

3. Cannot explicitly specify inheritance

The inheritance of styles is based on the hierarchy and specific rules of DOM elements in the browser.

4. Limitation of vertical control

The horizontal placement of elements is generally easy to control, while vertical control is not intuitive, more circuitous, or even impossible. Simply put, for example: vertically around an element, the end of the page can not be higher than the visible window (viewport, window or screen visible range) of the bottom of the range, need to be complex rather than intuitive style rules, or simple but not widely supported rules.

5, the lack of display

The current CSS does not have a clear and simple way to display attribute values (for example: margin-left:10%-3em +4px;). This is useful in many cases, such as the size limit of the calculated field in the total field. In any case, the CSS WG publishes a draft of the CSS limitations, while the InternetExplorer 5 version supports syntax display of similar functionality.

6. Lack of orthogonality  

The same effect can be done with different attributes, which is often confusing. For example, position, display, and float define different configurations and cannot be used interchangeably. A Display:table-cell element cannot specify float or position:relative because the specified float:left element should not be affected by the display effect. Furthermore, it does not take into account the effects of the newly created properties, such as in tables you should use border-spacing instead of margin-* to specify table elements. This is because, in accordance with CSS guidelines, the inner elements of a table have no boundaries.