I would like to make my footer the size of the body instead of the size of the main Div, if i change the width of the footer to width of the body its increased it in only one direction, if i then create a margin and put the opposite side as a negative, it then effect the contents within the footer, please see below a section from my style sheet:
You should not be setting height on your elements. That should be determined by content within plus top and bottom padding.
No need to repeat font-family, that cascades from body. No need for footer margin 0 0 0 0.
Remove the height from the wrapper and body elements. Like jurotek said, the content delivered will determine the height. If you set a height property on body, you will end up with a scrollbar 900px high if your content goes over that (overflow).
Step 2: The CSS
Leave your body property free of formatting with margins unless it’s really necessary. The only thing you should be using whilst learning CSS is the following:
Try to refrain from using the physical wording when assigning colours. use #000 for black, #fff for white and so on (Hex), It’s just better practise :). Plus, your footer won’t be stuck at the bottom. Use this awesome trick if you need. Otherwise, this is what you need: