9. To make the layout compatible by a vertical background image (bg image), the bg image should be the height of the higher resolution i.e 1024 X 768 pixels to be made compatible.
If the layout has to be made 1024 x 768 pixels resolution compatible then the height of the image should be around 800 pixels so that the design in the image doesn't tile after 768 pixels.
10. Choose Image > Canvas Size, enter 800 pixels and Click ok.
Select Move Tool and move the image to the top so that the image top edge touches the canvas top edge.
To fill the bottom empty space in the canvas.
Choose the Eye Dropper tool, Zoom the image upto 1600%.
Pick the color by clicking on the extreme bottom part of the image.
The color gets selected and is displayed in the Foreground Color Pallete.
Select the background layer and press Alt + Back Space to fill the color.
11. Press Ctrl + Shift + Alt + S ( to open Save For Web window )
Save the image in jpeg file format and colors as 52 & specify a relevant file name.
We have named as index-bg, so that it can be easily recognised.
12. Choose Modify > Page Properties > Background image, click on browse and select index-bg.jpeg image.
13. The image gets incorporated in the background of the layout.
Choose Window > Properties
Select the layout table and specify Align as " Left " from the drop down menu.
Check the layout in Internet Explorer.
Change the monitor resolution to 800 X 600 pixels or vice-versa i.e. 1024 X 768 pixels to check the layout compatibility.
Steps to edit the html page and make it 1024 X 768 pixels resolution compatible is complete.