Lesson 3: Working with CSS properties CHAPTER 4 181
The first thing you might want to do is set the <div> elements to a fixed location and size
to help you gain control of the placement of the <div> elements when you are creating your
page layout. Use the position property, which should be set to static, relative, absolute, or
fixed as follows.Using the static position
The element is displayed where it would normally appear in the HTML flow. This is the default
setting and is not usually used except to override settings that might have been applied.Using the relative position
The element can be offset from where it normally appears in the HTML flow. In this example,
div2 has the following style rule.
#div2 {
background-color: cyan;
position: relative;
top: 15px;
left: 30px;
}With the top set to 15 pixels, div2 and its contents will be pushed down 15 pixels from its
normal location. The left setting of 30 pixels will push div2 and its contents to the right by 30
pixels. The result is shown in Figure 4-13.FIGURE 4-13 he use of relative positioning to move div2 and its contentsT