untitled

(John Hannent) #1
The same concept applies to absolute positioning. After all, an inch on a PDA
screen is quite a different thing from on a giant projection TV set. So, even
though an inch is an absolute measurement, its effect is relative to the device
that displays your Web page. So don’t be disturbed by the somewhat slippery
concept of absolute in CSS styles.

Flow Versus Positioning, Floating Versus Coordinates ............................


If you simply add elements to a Web page — without specifying specific coor-
dinates — they flow(stack themselves against the left side, as illustrated in
Figure 4-1).

CSS provides two important positioning tools: floating and positioning. Getting
your mind around the various interactive features of these tools takes some
time, but you’ll be glad that you invested that time. For one thing, you can
often achieve a great goal that CSS makes possible: ridding your Web pages of
tables used for layout.

Chapters 9, 10, and 11 go into CSS positioning features in depth, but getting a
sense of what all the excitement’s about is a good idea — it gives you a little
taste of what you can do.

With CSS positioning, you can specify precisely where elements show up on
the browser. But note that this specification is relativeto their default position
or relative to other elements, the browser background. (Of course, when you
position something in terms of the browser background, you can consider it
“absolute” positioning. The browser frame is a Web page’s “universe,” so you
can ignore the fact that a user might move or resize the browser window. An
element positioned one inch from the left side of a browser window stays at
that coordinate through anything the user might do.)

Now look at the various ways you can use to modify the position property in
a CSS selector: static, relative, absolute, fixed, and inherit.

Static is similar to the default — what happens when you don’t specify any
position value. Static elements flow in the default way (they stack on the left
side), but they cannot be repositioned; they remain where they are and you
cannot give them coordinates (topand leftproperties). Nor can you adjust
a static element’s position using script, such as VBScript or JavaScript. They
remain where they are: static.

Relative positioning is like static, but you canuse topand leftproperties to
modify the default flow location, relative to other objects.

Chapter 4: Taking a Position 73

Free download pdf