Differences

This shows you the differences between two versions of the page.

Link to this comparison view

page_structure_in_the_ce2_framework [2011/09/02 00:07]
matthew [Footer]
page_structure_in_the_ce2_framework [2011/11/01 18:51] (current)
matthew
Line 41: Line 41:
  
 A blank canvas is one which contains neither grid nor block; in such case, PHPlugins may be used to fill in custom page content. A blank canvas is one which contains neither grid nor block; in such case, PHPlugins may be used to fill in custom page content.
 +
 ==== the Block ==== ==== the Block ====
  
Line 48: Line 49:
  
 The block may be positioned either above or below the grid, or not at all. Controls for the Block appear within the Color Palette control pane, with exception of the Typography controls, located in the Site Info control pane. The block may be positioned either above or below the grid, or not at all. Controls for the Block appear within the Color Palette control pane, with exception of the Typography controls, located in the Site Info control pane.
 +
 ==== the Grid ==== ==== the Grid ====
  
Line 55: Line 57:
  
 The grid may be positioned either above or below the block, or not at all. Controls for the Grid appear within the Appearance control pane. The grid may be positioned either above or below the block, or not at all. Controls for the Grid appear within the Appearance control pane.
 +
 ===== Footer ===== ===== Footer =====
  
Line 60: Line 63:
  
 The //Footer// resides at the bottom, or //foot// or the page. It may contain secondary "convenience" navigation, and/or provide a brief attribution/copyright notice, an assist to your site's branding. Controls for the Footer reside in the Site Info control pane. The //Footer// resides at the bottom, or //foot// or the page. It may contain secondary "convenience" navigation, and/or provide a brief attribution/copyright notice, an assist to your site's branding. Controls for the Footer reside in the Site Info control pane.
 +
 +===== The Box Model =====
 +
 +In the screen captures above, you can see that the CE2 framework is primarily composed of boxes appearing in a particular arrangement. Most of these boxes adhere to a common "Box Model". The standard CE2 box model utilizes two width sliders, Container Width and Content Width, pictured below.
 +
 +{{:ce2-framework:box-model-controls.png?|Box Model controls}}
 +
 +Each slider may be set to 'auto' or 'fixed', and includes a numeric slider.
 +
 +When Container Width is set to 'auto', it will ignore the value on the numeric slider. The container box will occupy the full width of the web browser; this is equivalent to width=100%. When set to 'fixed', the container box will respect the value on the numeric slider; this value will be used as the container's max-width.
 +
 +When the Content Width is set to 'auto', it will ignore the value on the numeric slider. The content box will occupy the full width of the container box; this is equivalent to width=100%. When set to 'fixed', the container box will respect the value on the numeric slider; this value will be used as the content's max-width.
 +
 +Box controls will sometimes also include controls for borders, shadows, padding, etc. These attributes are typically applied to the container, though may in some cases be applied to the content box instead.
Print/export