Pro HTML5 and CSS3 Design Patterns

CHAPTER 5 ■ BOX MODELS EXTENTS

Width

CSS

*.static-inline-shrinkwrapped { width:auto; }

*.replaced-inline-shrinkwrapped { width:auto; }

*.replaced-inline-sized { width:35px; }

*.replaced-inline-stretched { width:100%; }

*.static-block-sized { width:300px; }

*.static-block-stretched { width:auto; }

*.table-shrinkwrapped { width:auto; }

*.table-sized { width:300px; }

*.table-stretched { width:100%; }

*.float-shrinkwrapped { width:auto; float:left; }

*.float-sized { width:300px; float:left; clear:both; }

*.float-stretched { width:100%; float:left; clear:both; }

*.absolute-shrinkwrapped { width:auto; left:0; right:auto; position:absolute; }

*.absolute-sized { width:300px; left:0; right:auto; position:absolute; }

*.absolute-stretched { width:auto; left:0; right:0; position:absolute; }