Drupal Overview
Drupal is a popular open source content management system, You can use Drupal as a great solution for a variety of websites ranging from discussion sites, blogs, personal web sites, corporate site, E-commerce applications, Intranet applications etc.
Free Drupal Theme
We will provide free high quality drupal theme for your website design. please give your feedback and help us to improve our designs.
How to use the drupal theme?
The Theme is tested on drupal 7 beta 3.
1. Downloading the theme from this page
2. Uploading it into this directory: your-drupal-installation/sites/all/theme/;
3. Go to Administration » Appearance and enable the theme.
Template Design Tips: Understanding CSS positioning techniques
Three of the most important CSS concepts to grasp are floating, positioning, and the box model. These concepts control the way elements are arranged and displayed on a page, forming the basis of CSS layout.
Relative positioning is a fairly easy concept to grasp. If you relatively position an element, it will stay exactly where it is. You can then shift the element “relative” to its starting point by setting a vertical or horizontal position. If you set the top position to be 20 pixels, the box will appear 20 pixels below the top of its original position. Setting the left position to 20 pixels will create a 20-pixel space on the left of the element, moving the element to the right. With relative positioning, the element continues to occupy the original space, whether or not it is offset. As such, offsetting the element can cause it to overlap other boxes.
Relative positioning is actually considered part of the normal flow positioning model, as the position of the element is relative to its position in the normal flow. By contrast, absolute positioning takes the element out of the flow of the document, thus taking up no space. Other elements in the normal flow of the document will act as though the absolutely positioned element was never there.
An absolutely positioned element is positioned in relation to its nearest positioned ancestor. If the element has no positioned ancestors, it will be positioned in relation to the initial containing block. Depending on the user agent, this will either be the canvas or the HTML element.
As with relatively positioned boxes, an absolutely positioned box can be offset from the top, bottom, left, or right of its containing block. This gives you a great deal of flexibility. You can literally position an element anywhere on the page. Because absolutely positioned boxes are taken out of the flow of the document, they can overlap other elements on the page. You can control the stacking order of these boxes by setting a property called the z-index. The higher the z-index, the higher up the box appears in the stack.
Fixed positioning is a subcategory of absolute positioning. The difference is that a fixed element’s containing block is the viewport. This allows you to create floating elements that always stay at the same position in the window.
The last positioning model is the float model. A floated box can either be shifted to the left or the right until its outer edge touches the edge of its containing box, or another floated box. Because floated boxes aren’t in the normal flow of the document, block boxes in the regular flow of the document behave as if the floated box wasn’t there.