Page History

• Bootstrap uses fixed width containers that "snap" across breakpoints
• Grid layout needs to follow a container-row-column hierarchy. Otherwise 15px paddings / margins don't align properly.

• Foundation uses fluid width containers that stretch and shrink depending on the size of the client, with relevant breakpoints.
• Foundation has a row-column hierarchy with paddings on the columns only. Row is only for containment.

• uses normalize.css

• in Bootstrap CSS.

• normalize.css is included in default package, but optional whether or not it is used in your markup.

Current release (v3) uses pixels and not EMs. However, v4 (unreleased) will support EMs. See Mark Otto's January 9th response in this thread on Github.

• Note: EMs will be supported. Unclear if REMs will be used.
• UIO works well with Bootstrap's pixel units, although EMs are more desirable.

• REMs are desirable .

• and easier to use for CSS styling than EM because REMs always refer to the root EM and not the parent EM as with EM units.
• REM units currently do not scale properly in UI Options. See

  Jira
  server Fluid Project Issue Tracker key FLUID-4698

• +/-15px margin and padding on container, rows, and columns dictate a hierarchy and usage pattern. Customizing this or deviating from this pattern causes unintentional and unwanted alignment issues which can be hard to correct (involves overriding).
• This hierarchy is required to ensure good scalable layouts.

• Bootstrap uses generic classnames which may cause classname collisions.
• A work-around is to use LESS or Sass to add a named container. See this as a possible solution: https://coderwall.com/p/uiwcow

UIO Theme generation using custom build- can it be done using the framework's customization tool?