• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Project 2. Styling a Photo Collection > Creating the Contact Sheet View

Creating the Contact Sheet View

At this stage, we can see the document structure itself: images followed by unordered lists. What we're after at this point is the creation of a “contact sheet” layout, in which the images are all laid out in a grid. This will let us see as many images as possible at once.

Floating Away

Since we aren't using a table, the obvious solution is to float the images. We know the images are no more than 128 pixels wide or tall, so we'll make our divs 128×128 and give them a white background and black border. Speaking of borders, we want to get rid of the blue link-border around the images as well.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint