I wanted to let you know that your assignments have been graded and I will enter your grades on Thursday February 8.

At that time you will be able to click on a specific assignment to see your grade and any provided feedback.

Let's Get Started - The Box Model

Whether you read the assigned text reading or start with the online lecture pages is up to you. However, you should read both before starting any lab/homework exercises.

The topic this week is the Box Model, which is the primary CSS mechanism for creating layout.

The Box Model is not exactly intuitive or simplistic. Developers spend an enormous amount of time dealing with the many issues involved, as well as the fact that IE 6 does not properly support and implement the CSS standard... argh!

IE-Windows' non-standard implementation is discussed this week, but the focus is on explaining what the Box Model is, understanding how it should work, and the various properties which affect boxes. Hacks will be discussed later in the quarter (to some degree) when we deal with positioning.

The lecture document sections this week are:

• The first contains information about The Basic Box Model and graphically illustrates what a "Box" is, defines terminology, and introduces key properties used in the Box Model.
• Borders, Padding and Margins, examines the three major properties which influence and affect how any box displays.
• We then get into depth with Understanding the Box Model which explores the relationship of "a" box to its properties, and the resultant display... now we are getting somewhere, and information which developers use/require on a daily basis.
• And we wrap up the discussion of additional browser tools which aide in the debugging and graphical display of "boxes" and their properties.

The Lab Practice

There are two non-graded lab practice documents this week.

The first will give you practice in using nested DIVs, and working with the box model properties.

The second document will give you practice working with the box model properties, and a chance to experiment with the effects of negative margins.

The Homework Assignment this Week

There are 2 separate documents assigned this week for homework 5:

• The first asks you to create two different callout-type boxes. Callouts are uniquely styled boxes which emphasize content... notes, warnings, trivia, etc. After you have completed the requirements, feel free to experiment and create your own customized callout below.
• The second document has you create a sized advertisement box similar to what you see on most sites. The work here will be to make the spacing and alignment of the headings and different advertisements so that the box looks professional as a result of your styling.

Time to get started!

Please let me know in the forum if you have any questions or issues.