Web Services Blog

Size images for branded pages

You can float images by adding the class right or left. Optionally, pair this with the code data-size="" to specify an image’s size.

  • full – image will fill 100% of its container
  • medium – image will fill 60% of its container
  • small – image will fill 40% of its container
HTML
<img src="" alt="image alt text" data-size="full">
<img src="" alt="image alt text" data-size="medium" class="right">
<img src="" alt="image alt text" data-size="small" class="left">
Image Sizes for Responsive Templates:

Page with left navigation, full width top of page: 1001 pixels by 350 pixels
Spotlights: 400 pixels by 300 pixels

For more information, see: Style Guide/Images.

See sample layout pages here.