به هم ریختن دیوها هنگام کوچک کردن سایز مرورگر

[moferferi]

سلام.
من یه صفحه طراحی کردم که توش از این سایت الگو گرفتم
http://www.joomla-templatedemo.de/?template=siteground-j16-9
میخوام هدر سایتم مثل سایت بالا باشه.
اگه یه نگاه به سایت بندازین میبینید که قسمت بالا از 2 تا عکس با ادرس
http://www.joomla-templatedemo.de/templates/siteground-j16-9/images/headerimg.jpg
و یه عکس پشت اون با ادرس
http://www.joomla-templatedemo.de/templates/siteground-j16-9/images/wrapper.jpg
که سایزش 1160 پیکسل هست
و یه بک گراند با ادرس
http://www.joomla-templatedemo.de/templates/siteground-j16-9/images/page_bg.png

من دقیقا همین را طراحی کردم.ولی موقعی که سایز مرورگر از 1160 پیکسل کوچک تر بشه دیو هدر و دیو وسطی که دیو بدنه سایت هست و سایزش 990 پیکسله موقعیتش به هم میخوره.

لطفا سایت اصلی و کد من را یه نگاهی بندازین.و در صورت امکان راهنمایی کنید که چطور میتونم هدر سایتم را مثل اونی که گفتم طراحی کنم.در ضمن نمیخوام عرض دیو بدنه سایت از 990 پیکسل بیشتر بشه.
این کد

<div id="dv-header-main">
<div id="dv-header">

<div id="dv-header-inner"></div>

</div>
</div>
<div id="warp"></div>
<div id="footer"></div>
و این هم css
body {margin:0px;padding:0px
}
#dv-header-main{width:100%;height:280px;overflow:hidden;backg round-image:url(../images/temp/page_bg.png);background-repeat:repeat-x;}

#dv-header{width:1160px;height:280px;background-image:url(../images/temp/wrapper.jpg);
background-repeat:no-repeat;margin-left:auto;margin-right:auto;
}
#dv-header-inner{width:960px;height:280px;overflow:hidden;mar gin-left:auto;margin-right:auto;background-image:url(../images/temp/headerimg.jpg);}
#warp{width:990px;height:500px;background-color:Gray;margin-left:auto;margin-right:auto}
#footer{width:990px;height:100px;background-color:Black;margin-left:auto;margin-right:auto}

[moferferi]

راستی یه چیزی هم تازه متوجه شدم.تو خود سایت هم وقت که مرورگر کوچک بشه سمت راست و چپ عکس هدر خراب میشه.
چطوریه که یه همچین تمپلیتی چنین باگی داره.
و ایا میشه درستش کرد؟

[2undercover]

من تو سایتی که گفتید مرورگر رو کوچیک کردم ولی بهم نریخت.
ولی در هر صورت مشکل کد شما اینه که width دایو dv-header-main تونو به صورت درصد دادید که یک اندازه متغیره به خاطر همین بهم می ریزه برای این دایوتون باید یک اندازه ثابت در نظر بگیرید!

[hamed_hossani]

سلام
فقط قسمت headerش را طراحی کردم
با chrome>>راست کلیک > قسمت inspect element می تونی تگ ها و فایل css رو ببینی!