css. Помогите отредактировать отступы margin и padding.

[DimaP]

ссылка на мой html и css код:
https://jsfiddle.net/w7fLp5g4/
 Помогите плиз сделать блок "контент" вровень с "шапкой". По ширине. То-есть чтоб правый край шапки и правый край контента лежали на одной прямой. И ещё необходимо выровнять текст на блоках (Шапка, Контент, Левый блок) ровно по середине блока (желательно с помощью свойств margin и padding). По высоте и ширине. То-есть чтоб текст находился ровно в центре блока.

[Proger300]

Как вариант:
 

<div id="wrapper">
	<div id="header">Шапка</div>
    <div id="middle">
		<div id="menu">Левый блок</div>
		<div id="content">Контент</div>
    </div>
	<div id="footer">Подвал</div>
</div>

#middle {
  position:relative;
  margin-right:64px;
  margin-left:64px;
  background:red;
  margin-bottom:35px;
  }
   #menu {
    width: 210px; 
    height: 376px; 
    float: left; 
    background: #33CC00; 
	margin:0px 0px 0 0;
  position:absolute;
  top:0;
  left:0;
	margin-right:35px;
	border:1px solid black;
}
   #content {
    background: #99FFFF; 
    height: 376px; 
    float: right;
	width: 100%;
  padding-left:245px;
  box-sizing:border-box;
	border:1px solid black;
	
}

 

[Igor Schnaider]

@DimaP, у вас же там вообще везде фиксированная ширина, зачем для #content ширина 60%