tutorial - flexible page

Page 3.

I guess you have noticed something here, not only have we faded the photo part of the side graphic out, but also the white fill and the black line.

No problem, we fix this by adding a white filled square - w=15, h=230, x=75, y=105, then select the Paint Brush, stroke Basic - Soft Line - 2px and draw a new black line.

Example graphic with fade to transparent.

The only other step left to finish this graphic is changing the back color to match the rest of the page background.

The easiest way to do this is change the canvas colour. For this page we are using a canvas colour of #BCE6FE, this picked from the sky on the top graphic.

The finished side graphic is on the right.

Example graphic with fade to blue background.

Next, we need to make a background graphic for the left cell. The easiest way to do this is chop a bit off the bottom of the side graphic. Crop off a piece 90px wide by 30px high. This goes into the left cell as the background.

We need small bottom corner graphics, a background for the bottom row, and a background for the right side.

Bottom left corner: Example bottom corner graphic.

Bottom cell background: Example bottom background graphic.

Bottom right corner: Example bottom right corner graphic.

Right cell background: Example right side background graphic.

Those are the easy bits. We need to make a top of the page background, and a top of the right side graphic.

Let us put these all together - see the next page.

 

 

<---- Back | Next ---->


Page 1 | Page 2 | Page 3 | Page 4 | Page 5 | PSP 1 | PSP 2
No tables 1 | No tables 2 | No tables 3 | No tables 4 | No tables 5

Home | Photos | Photo Gallery | My Blog | Personal | Tutorials | Contact

Copyright © Denis Wilford 2001-2014.

Creative Commons License
This work is licensed under a Creative Commons Attribution 3.0 Unported License.