1. Make a new HTML page with a white background color.
2A. Create an invisible box1 that is 630 pixels wide and 420 pixels tall. Position this box so that it is 212 pixels vertically2 away from the top of the page. Also make sure that this box is horizontally centered3 on the page.
2B. Inside the invisible box (2A), create another invisible box that contains a 296 pixel wide by 209 pixel tall image. (The image is up to you, but it must be those dimensions.) This invisible box is horizontally centered. After this, create another invisible box underneath the previous one. Make sure this new box has 26 pixels of vertical space separating it from the previous box. It should be 541 pixels wide by 27 pixels tall. Give this invisible box a border that is one pixel, solid light gray color4. After this second invisible box, create a third invisible box underneath the previous one. Make sure this new box has 19 pixels of vertical space separating it from the previous box. Inside this box are two boxes that are side by side and horizontally centered. They both have background color of medium gray. The one on the left is 95 pixels wide by 28 pixels tall. The one on the right is 109 pixels wide by 28 pixels tall. Between them is 20 pixels of horizontal space. This concludes the box (2A)’s contents.
3. Make a new invisible box. This box should be 40 pixels tall and 100% wide. It should have a background color of light gray. Position it so that it is fixed as a bar on the bottom of the page5.
4. Make another new invisible box. This box should be 85 pixels wide by 30 pixels tall. It should have a background color of medium blue. Position it so that it is fixed to the page in the upper right hand corner: it should be 37 pixels from the right side and 17 pixels from the top.
1. Make a new HTML page with a white background color.
2A. Create a box that has a blue background. It should be 95 pixels tall and 100% wide. It should touch the edges of the page and be the first thing you see from top to bottom.
2B. Inside this blue box, there is an invisible box that is 960 pixels wide and 95 pixels tall. It is horizontally centered.
2C. Inside this box are two things. First, create the largest heading. Inside this heading is text: 14 characters (no more, no less). This text is colored white and size 48 pixels. The font is a serif, Crimson Text6. It is left aligned to the box it is inside (2B). Make sure that it is 37 pixels away from the top of the page. Second, there is an invisible box that is 25 pixels tall and 213 pixels wide. It has a light blue 1 pixel solid border. It is right aligned to the box it is inside (2B)7. Make sure that it is 7 pixels away from the top of the page.
3A. Next, create a new invisible box that is 960 pixels wide and 95 pixels tall. It is horizontally centered.
3B. Inside this box, create another invisible box that is 192 pixels wide and 563 pixels tall. Inside this box, there should be a list of 8 items. Each item in the list is 28 pixels tall. The font is Verdana and is 13 pixels tall. Each item should be a link that is colored dark blue. On hover, the links turn light blue with a gray background.
3C. Create another invisible box that is 768 pixels wide and 618 pixels tall. This box should sit to the right of the previous box (2A)7. Inside this box is an image that is 768 pixels wide by 310 pixels tall. (The image is up to you, but it must be those dimensions.)
4. Make a new invisible box. This box should be 63 pixels tall and 100% wide. It should have a background color of blue. Position it so that it is fixed as a bar on the bottom of the page.
1. Make a new HTML page with a light gray background color.
2. Create an invisible box. It should be 57 pixels tall and 100% wide. It should have a bottom border of 1 pixel solid black. It should touch the edges of the page and be the first thing you see from top to bottom. Inside there should be three words. They should be styled so that they are all caps, font size 17 pixels, and the font is Inconsolata.
3A. Create a new invisible box that is 630 pixels wide. It should be horizontally centered.
3B. Inside that box, create a circle that is 200 pixels wide and tall8. It should have a 1 pixel solid black border. Make sure that it is 29 pixels vertically away from the top bar.
3C. After drawing the circle, create another invisible box. This invisible box should have a top border of 1 pixel solid black. Make sure that it is 39 pixels vertically away from the circle. Inside this invisible box, create a list. There should be 15 items in the list. Each item in the list should have at least one word and should be styled so that they are font size 17 pixels, and the font is Inconsolata. Each item in the list should be 53 pixels tall and have a bottom border of 1 pixel solid black. When you hover over one of the items in the list, the background color should change to yellow. Make sure that the last list item is 100 pixels away from the bottom of the page.
div HTML tag. Remember that if you are looking for something display: block, div is the most common thing to use. For something that is display: inline, use span HTML tag.auto. For example: margin: 0 auto;.