html的div的top,html - CSS - fix div to top center - Stack Overflow

I would like to center a div inside of the header which is 100% width. The div that needs to be centered has a physical width and height. I have tried using position absolute, but when resizing the screen, the div will stay centered. I want the div to stay in the center of the design, not the screen. How do I accomplish this? I also do not want to use position fixed for this.

css:

header{

position: relative;

width: 100%;

height: 65px;

background-color: #662D91;

}

#banner{

position: absolute;

left: 50%;

margin-left: -240px;

width: 480px;

height: 115px;

border-radius: 20px;

}

HTML:

EDIT: I have solved my issue by adding a div between the full width header and the logo that is the width of the design. It appears to have fixed my problem.

JSFiddle of my solution to my problem: http://jsfiddle.net/U3Hpa/2/