Design for web: Website foundations

From the previous post, I decided to change the navigation bar because I realised when it would come to actually making the website it's going to be difficult to align them properly so i opted to do it this way so it would be a lot easier getting them all on properly. 

Before diving into dreamweaver I used my mock-up website to help me calculate how big I wanted to make my website, I decide to make the container in the middle to be 1080px x 700px.  

I had a bit of trouble figuring out because I was unsure how it'd look considering I'm working on a macbook retina, I stuck which what I calculated in illustrator and it surprisingly worked alright.

I used the steps from the session with simon to help me get the jist of how to get the initial steps of the website going, for the suit pattern I needed it to repeat so it would fit any screen so i googled to find out how and found this piece of code:

{

background-image:url('_____');
background-repeat:repeat-y;

}

I used 100% so it would fit the page no matter the size.

I was surprised after I wrote it in that it worked really well. I then put on top of the a container of the red i had been used which was #E35653!

The little black box there is what happened when i first tried to put in my nav bar, I couldn't get it aligned to the centre which i got stuck on still i figured out it as to do with margins not position.

Putting in the buttons was fairly easy after that I didn't realise how easy it was once you have them placed within the div of the container below they all fall into place. It amazed me how easy that part of it was. I was bricking it because I didn't think it was gonna work. I made them into roll overs too.

I used the same technique I did on getting the navigation bar centred but It didn't seem to work for this container if you look you can see it's slightly off, I think it might be to do with the div tag, I couldn't get the container for the text that says 'how many players' on either (picture below) it was pushing out the logo from the nav bar for some reason.

I'll fix it tommorow.