html - Text absolute positioning within styled bar at 100% -

i have layout header bar 100% width , footer 100% width, content centered , 800px wide.

i attempting make text float justified content area upon window stretch, can't figure best way to this.

example

i've tried absolute positioning , relative positioning within header div when window stretches, either text 1 staying in same spot, or left justifies within text 1 bar.

thanks in advance

you can try this

you can remove width: 100% block element take full width.

and add 1 more div inside header , footer width: 800px , margin: 0 auto center inner content.

html

<div class="container">  <header> <div class="cnt">header text</div> </header>      <div class="content">         div content......     </div>  <footer><div class="cnt">footer text</div> </footer>  </div> 

css

.container{      height:100%; }    header,footer{      height:50px;     border:1px solid red; } .cnt,   .content{     width:800px;     height:100%;     border:1px solid blue;     margin: 0 auto; }