OUGD504: Design Production - Design for Web Testing my skills

I have a firm idea of what I want my website to look like and I have produced several wireframes and thumbnails of my ideas. After completing the web sessions I wanted to refresh my skills and build a website very quickly like we did in the session. I used the same dimensions which were provided by Simon in the session because I thought it would be the most simple way to test my skills. 

I opened up a document in Dreamweaver and set up a stylesheet and coded the basic information into it. I was given a very basic page with a title and a navigation bar across the top. I had not coded the width correctly along the top but I was very happy with the basic design I had come up with as a start.  I knew that I wanted my navigation bar to be down the left hand side so I tried out the coding of a left aligned bar in the below. After doing this simple task I can now use this as a base to start my website based on the wireframes I have created. 

Coding so far:

Wireframe #1

I have a rough idea about the pixels and the spacing between each different aspect of the site so it is just down to me trial and error testing my site with Dreamweaver.

Adding a scroll bar

I want to add a scroll bar to my website because I think it will be really boring and defeat the purpose of interactivity with the user if it is a static non-moving web page.

We were not taught how to add this in the session so I have had to watch several tutorials in order to get an idea of how to add it.

The first one I watched was by Josh Brickey from USA.

Source

This explained how to add a scroll bar to a particular text box not the whole page, I tried to apply his coding to my website to see if it would add a scroll bar to the page.

This is the code which I got from his tutorial. I recognised most of the jargon which was within it so I thought it would be a good plan to try it out.

Adding the overflow to my stylesheet

Adding the div id into my html document

Nothing happened, I am wondering if it is not working because I do not have any content on the page as of yet. 

Adding columns to the page

I repeated the code from the session as it fit in with my wireframe but it did not work. 

Adding the div id's to my html document did not help either

Adding Lorem Ipsum into the column to see if that was the problem. I also deleted the overflow scroll option to see if that was causing the problem. 

The blue box changed and the type I had added had gone into the navigation bar as I hoped. The lorem ipsum had still not shown up in the columns I had created.