The width of body/html less than width of browser issue

[tonak]

I am working on a website for client / design studio, there was strange issue where I found that despite having body and html elements set to width 100% and when I resize browser, the scrollbar appears forcing me to scroll the right only to find there is a gap on the right side in about 150pixels. The body element container () sets itself to fixed width of 1240px when the browser is resized but still leave the gap on the right side.Here is css code for body element.\[code\]body {min-width: 1200px;max-width: 100%;left: 0px;right: 0px;width: auto !important;margin: 0 auto;padding: 0;background: url('images/bg-repeat2.jpg') repeat;line-height: 1;font: 'BitstreamVeraSerifRoman', Arial, sans-serif;}\[/code\]here is the css for html element:\[code\]html {margin: 0 auto;padding: 0;width: 100%;min-width: 1200px;left: 0px;right: 0px;}\[/code\]I am not using "overflow-x: hidden;" property due to concerns in the need for scrolling in smaller screens and mobile devices as well. Please note that this site is desktop version.I would appreciate if anyone in this community can assist by providing solution or fix.Thanks.