This is a CSS test designed to evaluate the skill a candidate posses with regard to CSS layout and appearance. It is not meant to test CSS3 capabilities or more cutting edge CSS. There are 3 different images included in this test, each of varying difficulty to emulate. A developer can gauge their skill based on which image they are able to duplicate.
Using the provided HTML and CSS files, create the layout matching one of the included images
- Expert Level Dev Test: final-expert.png
- Senior Level Dev Test: final-senior.png
- Mid Level Dev Test: final-mid-level.png
- The HTML markup may not be modified in any way
- Margins, padding and white space do not need to be exact, but alignment of page elements should be pixel perfect
- Font sizes do not need to be exact but should be appropriately sized, relative to other font sizes used
- The finished layout must match the image relatively between window sizes 1024x800 and 1400x9000
- The finished layout should match image colors generally, but be consistent. An exact color match is unnecessary, however, expert level CSS devs should understand how to get a general color or shade using rgb() or HEX Codes.
- The finished layout should not use CSS breakpoints
- Progress can be checked at any time with a browser refresh of the test html page.
- Try to not use search engines or other reference materials , with the exception of obtaining color codes for the non-expert level tests.
- Submitted code must be justified by candidate.