Changes

After getting feedback from my crit, I have made a few changes to my website. The first thing I changed was getting rid of the scroll box, this was reasonably simple as I just needed to take out the overflow and tweak a few other bits, here is the final code I was left with for my content box.



.scrollbox{
margin-top:25px;
margin-bottom: 50px;
width:650px;
padding:10px 20px 0px 10px;
background: white;
opacity:0.7;
filter:alpha(opacity=70);
float:right;
}




The next thing I changed was the placing of my footer as this now needed to be at the bottom of the entire page not just the bottom of the screen, this was a little more tricky as I needed to clear the floated objects, this is the final code I used for my footer navigation.



#footer {
   width:100%;
   height:210px;
   background:url(../images/foot2.png);
   clear: both;
}


ul.bottom-nav{
margin: 0px auto 0px auto;
padding: 170px 0px 0px 170px;
list-style: none;
width: 600px;
}


ul.bottom-nav li{
float: left;
}


ul.bottom-nav a {
padding: 0px 20px;
text-decoration: none;
color: #fff;
}




The final thing I changed from crit was moving my logo into the header div, this again was very simple, all I did was create a div called header and placed it within the wrapper, then added an image inside, this is the final code.


HTML code:

<div id="header">
<img src="images/logoblocks.png" alt="PACES" height="120" width=420" />
</div><!--end of header-->


CSS code:

#header{
margin-top: 0px;
margin-left: 0px;
}

I also made a few extra changes which were not mentioned in the crit, I added some text styles using <p> <h3> and <span> tags, here you can see my css code for my text styles.

.caption, .first, .black{

font-weight:600;

}

p{

padding-bottom:20px;

}

h3{

padding-bottom:10px;

}

After making these changes my site now looks like this...