1 / 2

Top bounding image (wraptop.jpg)

23 Blueprint “gaps” (10px each). …. …. 950 px (span-24). 24 Blueprint “grid squares” (30px each). Top bounding image (wraptop.jpg). +. Header background image repeating-x (header_bg.jpg). +. map(fma.jpg). Note: The border will be overwritten by the background images colors. +.

tamyra
Download Presentation

Top bounding image (wraptop.jpg)

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 23 Blueprint “gaps” (10px each) … … 950 px (span-24) 24 Blueprint “grid squares” (30px each) Top bounding image (wraptop.jpg) + Header background image repeating-x (header_bg.jpg) + map(fma.jpg) Note: The border will be overwritten by the background images colors + Main wrapping image repeating-y (wrapmid.jpg) + Main background image - ie the beige (info_bg.jpg) + Footer background fill color bottom bounding image (wrapbotom.jpq)

  2. Problem: If we try to allow the border to take up a grid point (span-1), we get this: … … 950 px (span-24) (span-22) This will leave a whitespace gap on the page 40 px total Solution: Resize/recreate the border images so that they can fit into a single blueprint grid square and gap and we can span the main content over 22 grid squares. Example (background border for header):

More Related