White space on right side of header on zoom

Question

I am developing this website.

The problem I am facing is white space on right side of header on zoom in. I did all sorts of things but failed to fill the white with area of header part with black.

Relevant CSS code: (I am not pasting the whole code as it is too lengthy, you can find it in the website)

header
{
    float:left;
    width:100%;
    height:700px;
    background:#000000;
    -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
    -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
    box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
}

.header_main
{
    background: #000000;
    -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
    -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
    box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
    float:left;
    height:800px;
    width:100%;
}

score 0 · Answer 1 · answered Mar 03 '13 at 09:12

0

It is because on your http://www.brilliantseotechnologies.com/css/2nav.css you have width:98% for your ul.menu class

answered Mar 03 '13 at 09:12

MIIB

1,849
10
21

Shail · Accepted Answer · 2013-03-04T01:08:14.357

There are lot of issues , follow as suggested below:

1 .slideshow{margin: -10px 0 0 50px;} Remove this line from the class .slideshow

2 .headrouter{ padding-left:100px; width:1200px;} Remove padding-left and set width:1100px

3 #site_content {margin-left:50px; } remove margin-left

4 Add overflow-x:hidden to body like below:

       body {
       background: none repeat scroll 0 0 #FFFFFF;
       font: 80% Arial,Helvetica,sans-serif;
       overflow-x: hidden;
      }

That should resolve the issue.

White space on right side of header on zoom

2 Answers2

Linked