This week we built a 3 column layout using floats and absolute positioning.

This is the page that I am going to use to display for my homework for this week. We used absolute positioning to create this page.

I am going to include links that will take you to pages that have information on creating pages with floats, and also with absolute positioning.

There are still a few things to learn in regards to absolute positing. One thing is, why doesn't the page work, unless the center is the same size as what was planned in the homework? I removed the dummy text, but had to increase the amount of text in this section in order for the page to layout correctly. If, I have less text in here, then the page will not layout right. The nav, right column and the center column will fall over the footer section. I can, however, increase the center paragraph as much as I wish and it doesn't seem to keep the page from falling apart on me. It appears that absolute positioning does have a bit more to it yet to learn.

It is going to be interesting to see what happens with my page as I add the links to the right hand column of the page. My plans at this point are to add links to float information as well as links to information on absolute positioning.

This is interesting. In firefox, the links on the right are showing up so that there is no space in between the lines. In IE the links have a space. This is a bug in IE that adds a margin when you add display block to the anchor. If you add a width to the rule of 100% the marin goes away. My list is now displaying properly in both IE and in Firefox.

Just as I suspected. As I added the links to the right hand column, the column extended down past the footer.

The above paragraph was enough to correc the problem in IE, however it wasn't enough to cover the difference in Firefox. It took the addition of this paragraph to make sure that the right hand column did not extend down over my footer on this page. I now need to learn how to do this so that the right column doesn't extend into the footer div.

New Problem! In mozilla, the right column is over the footer, even with the addition of the above information to make sure I had enough text to take care of the problem in IE and in Firefox.

A new problem was pointed out to me by a friend. In a larger screen resolution, my page was falling apart. What I did was put a 275px margin on the bottom of the center div. This proved to work in the larger screen resolution. I'm not sure if this was the correct way to do this, but it does work for now.

Grade for class work