Cover of Vanishing Girl - a young sherlock holmes mystery - by Shane Peacock
A little H6 text below the image
Cover of Vanishing Girl - a young sherlock holmes mystery - by Shane Peacock Cover of Vanishing Girl - a young sherlock holmes mystery - by Shane Peacock
atto_lightborder on the left and atto_darkborder on the right

Text inside the atto_gallerypic div gets centered. Probably will have nothing here. Malesuada in, ultricies molestie, ornare ac, tortor. It's best not to be too chatty. Praesent ac nisl ac lorem faucibus accumsan.

Title Goes Here

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In sapien ante, pharetra a, commodo vel, eleifend a, lacus. Integer imperdiet, est sed bibendum lobortis, neque diam lobortis nisi, sit amet mattis quam neque ac lorem. Curabitur diam neque, elementum at, aliquam vitae, vestibulum non, leo. Vestibulum congue odio eget dolor.

Pellentesque cursus, eros eget porta lacinia, arcu erat volutpat augue, sed facilisis magna nisl ac ante.

Aliquam ultricies pretium risus. In dolor. Ut adipiscing viverra velit. Suspendisse imperdiet lectus ac erat. Integer dui ipsum, volutpat vitae, ullamcorper vel, rhoncus at, enim. Nunc orci libero, nonummy non, elementum vel, interdum dignissim, leo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. In eros velit, interdum nec, vestibulum nec, blandit sit amet, diam. Pellentesque euismod, risus in cursus sollicitudin, diam felis tincidunt quam, quis lobortis ante libero non nulla. Mauris massa massa, elementum et, molestie sit amet, varius tempor, felis.

a blue iPod
243 wide image in a 150 wide div should extend into the margins, which can be attractive when used judiciously. IE6 does not support this and pushes the div to the left to accommodate the width of the graphic.

Maecenas purus enim, malesuada in, ultricies molestie, ornare ac, tortor. Praesent ac nisl ac lorem faucibus accumsan. Suspendisse quis elit sit amet mauris porttitor vestibulum. Vivamus massa augue, eleifend vel, convallis eu, iaculis venenatis, purus. Maecenas blandit scelerisque mauris. Sed elementum. Pellentesque cursus, eros eget porta lacinia, arcu erat volutpat augue, sed facilisis magna nisl ac ante. Vivamus tempus, leo eget aliquet rutrum, ligula augue blandit quam, sagittis iaculis metus lectus quis elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc a massa a elit laoreet commodo.

this is a button this is a button this is a button this is a button with a really long text string this is a button this is a button

Title Goes Here - H1

Title Goes Here - H5

Title Goes Here - H1

Title Goes Here - H2

Title Goes Here - H4

Title Goes Here - H6

Title Goes Here - H3

Vivamus diam. Aenean ligula purus, vulputate ac, gravida sed, elementum id, augue. Etiam quis tortor. Pellentesque eget magna eu tortor malesuada vulputate. Mauris eros. Mauris risus mi, euismod nec, semper quis, consequat a, metus. In malesuada scelerisque neque. Quisque eu odio eget nunc interdum rutrum. In vehicula rhoncus leo. Phasellus sodales venenatis augue. Vivamus convallis imperdiet elit. Mauris a nisl aliquet urna sagittis hendrerit.

a blue iPod
100 wide image in a 100 wide div.
  1. this is my ordered list item
  2. this is my ordered list item
    • this is a list item in a nested list
    • this is a list item in a nested list
    • this is a list item in a nested list. Mauris risus mi, euismod nec, semper quis, consequat a, metus. In malesuada scelerisque neque.
    • this is a list item in a nested list
  3. this is my ordered list item
  4. this is my ordered list item
  5. this is my ordered list item
  6. this is my ordered list item
  7. this is my ordered list item
  8. this is my ordered list item
  9. this is my ordered list item
  10. this is my ordered list item
  11. this is my ordered list item. Mauris risus mi, euismod nec, semper quis, consequat a, metus. In malesuada scelerisque neque.
  12. this is my ordered list item
  13. this is my ordered list item
  14. this is my ordered list item
  15. this is my ordered list item

Red River Ransom

A Tom Austen Mystery

Cover painting for young adult novel

Project included 11 line illustrations for chapter heads. Very light detail text goes here, underlined link, in many cases there may be nothing here.

view full size more info

Chapter head illustrations:
1 2 3 4 5 6 7 8 9 10 11

Would it be better to put each image on its own page, all the chapter heads on a single page and scroll, or to attach a lightbox script to these buttons? Maybe all links to graphics are lightboxed with only the 'more info' button actually loading a new page.

  1. ordered lists get
  2. an indent to
  3. accomodate numbering
  4. the links

Showcase

This list of text links can be sections such as 'flash' and 'websites' and can also include internal thumbnails in a nested grid.

<div class="atto_clearfloats"></div> at bottom of atto_thumbnails list ends the floats and allows the bottom margin of the parent li to function properly.

http://www.attoboy.com/showcase/