2 Domain Hosting

Placing and Aligning Images

After an image has been inserted, it is important to consider the image's placement and alignment. Adjusting the placement of an image allows you to control the amount of white space between the image and surrounding text or images, creating a more visually appealing web design. The image's alignment refers to the actual location of the image in relation to text or other images on the web page.

• Placing images
• Aligning images

Placing Images

If there does not appear to be enough white space between an image and surrounding text, you can adjust the vertical and horizontal spacing of the image to add or subtract white space around the image.

Adjusting Vertical Space

Adjusting the vertical space of an image adds or subtracts the number of pixels creating white space along the top and bottom of an image, separating the image from surrounding text. This example illustrates the difference between the appearance of a single image set at two different vertical space values. The image is identical in both examples, but the vertical space value of the left image is set at zero, while the vertical space value of the right image is set at 20.

1. After you have inserted your image, select the image by clicking it

2. From the Properties pane, in the V Space text box, type the desired value of vertical space in pixels
   

3. Press [Enter]
   OR
   Click outside of the V Space text box
   The new value is applied to the image.

Adjusting Horizontal Space

Adjusting an image's horizontal space changes the amount of white space on both the left and right sides of the image. This space separates the image from surrounding text, creating a more appealing web design. This example illustrates the difference between two different horizontal space values. The image is identical in both examples, but the horizontal space value in the first example is set at zero, while the horizontal space value in the second example is set at 20.

1. After you have inserted your image, select the image by clicking it

2. From the Properties pane, in the H Space text box, type the desired value of horizontal space in pixels
   

3. Press [Enter]
   OR
   Click outside of the H Space text box
   The new value is applied to the image.

Aligning Images

Appropriate image alignment is important for creating effective web pages. Dreamweaver offers ten different image alignment options. Each option changes the way the image is aligned with surrounding text and other images.

For a complete illustration of each alignment option, see Illustrating Image Alignment

1. After you have inserted your image, select the image by clicking it

2. From the Properties pane, from the Align pull-down list, select the desired image alignment
   
   The alignment is applied