HTML 3 – DesignWerx

Our first CSS-focused exercise starts you off with this generic 2-column layout (right-click on the link and “save link as” to download the HTML page into your root folder). You’ll note I’ve color-coded the backgrounds to help you figure out what IDs and tag selectors are used for the design.

Your job is to adapt what you’ve got to create something that looks like this.Yep, seriously. You can do this!

You will also need these two image files — CTRL or right-click and save them in your images folder.


background image

A few quick tips:

    • The DesignWerx logo can be coded into the <header> with a simple <img> tag — no need to put it into the background.
    • For the borders, try to find the fewest number of border declarations you’d need to add.
    • And don’t forget to look at my code if you’re looking for help!

Western University: Faculty of Information & Media Studies

Powered by WordPress. Designed by WooThemes