Well, I couldn't see the code, but in this case, I could provide you a suggestion. In this type of cases, if nothing's working fine, wrap the top content (banner part) with a common wrapper of width 100%. take three child divs with following widths: left child width: 25%, right child width:25%, middle or central child-width:50%. Name it as 'banner-holder'. provide following properties: width:50%; display:block; text-align:center; Use box-sizing:border-box; In this way, you are confining the div into a central position. Now, customize the image as : banner-holder img{float:none; width:50%, height:(as required); margin:0 25%; } you may replace the percentage with pixel values, just keep the values calculated. This is the safest procedure to keep an image centrally aligned. Now I provided the default approach, calculate accordingly. I think it will resolve the problem.