i have managed how to set full width of the div's and full height of the page thanks to your example. thank you a lot.
still wonder if there is a way to set the "src" (in your example is the "content") in a way that it will take all the space that remain between the header and the footer without placing specific height value in px/em. Is there any solution that allow to divide the blocks by percentage relatively to the defined height of the entire html document? (ex. header takes 25% of the entire page height, footer 15% and src the rest 60%) or maybe any other ways to solve this?
this is my new css file:
margin: 0 auto -103px; /* the bottom margin is the negative value of the footer's height */
margin: 0 auto;
padding: 0 0 103px 0;