Friday 09th of December 2016 06:17:05 PM

Nice and Free CSS Templates

This site contains free css templates for your website - Just copy and paste and there you have a stunning website !

Menu und content
dynamic

Menu fixed, content
since repeat is its default value.

Let's assume, though, that we just want images down the leftside of the document. Instead of having to create a special imagewith a whole lot of blank space to the right of the image, we caninstead make a small change to our styles:

BODY {background-image: url(yinyang.gif);background-repeat: repeat-y;}

As Figure 6-29 demonstrates, the image is simply dynamic


Menu und content
dynamic

3 columns all
dynamic

4 columns all
dynamic

Menu floating

Menu fix, Inhalt u.
Head dynamic

3 columns fix
centered

dynamic mit
Head und Footer

fixed BOX centered

dynamic BOX
centered

fixed Box total
centered

Figure 6-40

Figure 6-40. Lining up the center of the image with the center of the browser window

Thus, if you want to place a single background image a third of theway across the element and two-thirds of the way down, then yourdeclaration would be:

BODY {background-image: url(bigyinyang.gif);background-repeat: no-repeat;background-position: 33% 66%;}

The point in the background image that is one-third across anddoes not flow out to the right, because the width of its line boxesis still constrained by the width of the positioned element. If therehad been an image wider than the positioned element, or preformattedtext with a long line, this might have been visible to the right ofthe positioned element, up to the point where the clipping rectangleends.

The syntax of rect(...) is, as you may havealready realized, rather unfortunate. It is based on an early draftof the positioning section, which used the top-left-offset scheme. selector. This is in some ways like the child selector,but in this case, styles are applied to elements that share a parentand are next to each other in the document tree. For example:

H2 + P {color: silver;}

In the first set of markup, a paragraph immediately follows anH2, so it is silver. In the second, the elementadjacent to the H2 is a UL,which does not match the rule, and neither does the paragraph rightafter that. Finally, even though there is text directly after the