April Daisies Template
This template package does NOT require any specific web editor and is provided in zipped format with a default template page ready to create new pages with, an index page, and all supporting files.
Download this template package
The April Daisies template uses a fluid layout with a masthead, top menu, left navigation menu, content area and footer. The container is sized to be 80% of the viewer's window but will not exceed 1300 pixels as the maximum width. This can be changed by editing the style sheet #container style rules. The maximum width is achieved by using minmax.js This script makes the maximum width CSS property work transparently in IE version 5.0 upwards on all platforms except Mac. You can read more about CSS minimum and maximum sizes.
The left side menu for this template is from CSS Drive - Dashed Vertical Menu.
The template uses a XHTML Transitional doctype. Both the template and the style sheet validate.
Images
The page background image is April Daisies from Eos Developers. If you use the background, the credit link MUST remain. There are many background images available on their site in many different colors. You can use the solid color specified for the background rather than an image or create your own but it should be a tiled image so the repeats blend together.
The Site Name is a transparent graphic image sized at 443 x 116 pixels. You can create your own image to use but depending on the height, you may have to adjust the banner <div> height which is set at 120px. The font used for the masthead site name and tagline is akaDora BUT you can use any font you want to give you the "look" you want.
Classes have been created to float the images within the content area to the left or right. Images you use within your content area should be resized in an image editor to the size you are going to use and a 1px border added. ALL images should have an alt attribute for accessibility reasons. A blank one is fine if the image is just a decoration.
Editing template CSS
All styling for this template is within the external style sheet which has been commented for the various sections. If you want to change the font or the colors, make the change within the style sheet. Basic styles have been included but you will need to create others as you add content.
The lists within the content <div> use a graphic image for the bullets. The zipped package includes this page, and all supporting files/folders. A blank template is also included that you can use to create additional pages.
Ut quis odio. In hac habitasse platea dictumst. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In hac habitasse platea dictumst. Nunc mi. Integer congue, eros eu elementum gravida, nibh augue hendrerit purus, sed vehicula tellus augue id justo. Mauris et massa. Vestibulum viverra nonummy erat. Pellentesque pellentesque dui non est aliquet accumsan. Proin tellus mauris, fermentum ornare, rhoncus volutpat, ultricies vel, metus. Proin pulvinar, massa et porttitor eleifend, tortor lacus suscipit quam, id molestie dui sem non turpis. Cras suscipit, elit porttitor fringilla consequat, orci massa ullamcorper urna, vitae lacinia pede dolor eget ligula. Nulla augue felis, venenatis nec, rutrum et, sagittis id, odio. Duis vitae augue.
This is how a list will look:
- Main item
- Main Item
- Main Item
- Sub Item
- Sub Item