Planning for KompoZer to use CSS
This page describes the planning process which may be carried out to assist the implementation of CSS using KompoZer.
Considering the site specifications from the client, Joe's website may have a plan that looks something like the following diagram and table. The table would then be used to construct the CSS file for the site.
In this table of CSSvalues obtained from the specifications, the arrows represent where the styles are cascading into the child style:
| Body | Banner | Nav bar | Nav links | Nav hover | Content | |
| Text | Arial... | Bold, Centred, Font size large (say 40), Dark green | Bold, 16px, Dark green, No decoration | White | ||
| Line height | 24px | → | ||||
| Background | Light green | Grey, (Perhaps use strawberry image here - once only on left centred vertically) | Pink, with strawberry icon (left and centred vertically) | Dark Green | ||
| Borders | Dark green, (Perhaps have doule thickness about 5 px thick) | Solid 4px | → | |||
| Display | Block | → | Block | |||
| Float | Left | → | → | |||
| Width | 80% | 80px | → | |||
| Margin | Left 10% to place Banner in center. | Say 8 px all round | → | → | Left (say 120px?) | |
| Paddings | 5 px all round with extra on left for background image (25px?) | → |
This table can now be used to produce the CSS file for the site using KompoZer.