Sideway from Sideway

Draft for Information Only


CSS Wrapper
 Wrapper and Container
 Cascade, Inheritance, and Inheritance
 Functions of a CSS Wrapper

CSS Wrapper

Wrapper and Container

The word container is usually to name a tagged element that is used as the document structure builder for containing document content. A container may contain one, or more than one tagged elements which are grouped together to form a functional structure of a document. While a wrapper is a tagged element that is used as an interface for wrapping around another object to alter the functionality or layout of the wrapped object in the document.

In other words, container usually works with the context of document structure of a ducument and wrapper works with the context of presentation format of a document. CSS wrapper may be in simple, compound and complex forms which suited for simple to complex presentation.

Although a CSS wrapper is usually refered to as an additional tag used to wrap a functional container, sometimes a functional container can also be acted as a CSS wrapper to replace a dummy CSS wrapper when a functional container hold simple structure only.

Cascade, Inheritance, and Inheritance

The cascade, inheritance, and specificity are the most important features of CSS. These features are all based on the parent-child and sibling relationships. Sometimes, these relationships may cause trouble when designing a complex webpage. A CSS wrapper provides a simple solution to tackle these problems by either creating an isolated parent-child or sibling relationship, or breakng an existing parent-child or sibling relationship.

Functions of a CSS Wrapper

Some typical functions of a CSS wrapper are

  • A isolating wrapper is to isolate a contioner as a seperated container such that the unneeded cascade, inheritance, or specificity feature will be stopped by breaking the parent-child or sibling relationship. sibling relationship will be broken
  • A packing wrapper is to pack a functional container as an individual container such that the whole functional container can be modified and reused easily without altering the tagged elements insides a container.
  • A decorating wrapper is to add a decorating out tag to a container such that the presentation of the container can be altered by the additional tag.



  1., 1999, HTML 4.01 Specification: W3C Recommendation, updated 24 December 1999

ID: 180200041 Last Updated: 2019/3/16 Revision: Ref:


Home (5)



HBR (3)



Hobbies (7)


Chinese (1097)

English (336)

Reference (66)


Hardware (149)


Application (187)

Digitization (24)

Numeric (19)


Web (644)new



Regular Expression (SC)


Knowledge Base

Common Color (SC)

Html Entity (Unicode) (SC)

Html 401 Special (SC)

OS (389)new

MS Windows

Windows10 (SC)

.NET Framework (SC)

DeskTop (7)



Formulas (8)

Number Theory (206)

Algebra (20)

Trigonometry (18)

Geometry (18)

Calculus (67)

Complex Analysis (21)


Tables (8)


Mechanics (1)

Rigid Bodies

Statics (92)

Dynamics (37)

Fluid (5)

Fluid Kinematics (5)


Process Control (1)

Acoustics (19)

FiniteElement (2)

Biology (1)

Geography (1)

Latest Updated Links

Copyright © 2000-2019 Sideway . All rights reserved Disclaimers last modified on 10 Feb 2019