Styling Tables
If you use the same table layouts over and over again, it can make things easier to define the layout in your style sheet. So I want to add a photo album to my pages, many albums. Rather than styling each one, I create a style for that particular kind of table.
I use a fluid layout (percentage so the table will resize). Be careful though as the size of your images can have an effect on this. If I try and resize this particular layout to 800x600 screen resolution, the images will cause a horizontal scroll on the page. So I would either need to reduce the size of the image OR use fewer columns. While the images are centered within the able, the fact that two of them have a drop shadow make them look not quite centered. Add or remove the border depending on your preference. Same with padding. Play around with the tags you can use with a table until you get the look you want. Make sure and view your finished page in more than one resolution so you can see what your viewer might see.
Create a style sheet and table
View the source code for the styling for each of the tables. This is by no means complete but will give you an idea of what you can do with any kind of a table. I would also move the styles to my external sheet and I can then use them wherever on my site I want. And my photo album is just plain html code which helps the page load time and is much easier to change the style of if I choose.
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |
Photograph of person's Name and any other identifying characteristics. |