Проблем с разместване на сайт надясно

confiscate

Registered
Здравейте ,
Опитвам се да направя един сайт , но имам следния проблем:
При смаляване на резолюцията елементите от сайта ми се изместват надясно. Може ли да ми кажете защо се получава така ? Сайтът се състой от background върху който подреждам всичко.

Ето малко код от сайта:

HTML:
<div id="container">
<div id="navigation">
<ul>
<li class="home"><a href="index.html"></a></li>
<li class="about"><a href="about.html"></a></li>
<li class="contacts"><a href="contact.html"></a></li>
<li class="faq"><a href="faq.html"></a></li>
</ul>
</div>

<div id="slider">
<img src="http://photographer-bg.com/flowers/welcome.png" width="400" height="243" name="slide" alt="image" /> 
</div>
<div id="menu">
<div class="jimgMenu">
  <ul>
    <li id="buketi"><a href="#">Букети</a></li>
    <li id="aranjirovki"><a href="#">Аранжировки</a></li>
    <li id="koshnici"><a href="#">Кошници</a></li>
    <li id="svatba"><a href="#">Сватбени букети</a></li>
    <li id="dekorativni"><a href="#">Декоративни разстения</a></li>
    <li id="suhi"><a href="#">Сухи аранжировки</a></li>
  </ul>
</div>
</div>
<div id="content">
<div class="contentLeft">
<script type="text/javascript" src="js/slide1.js"></script>
  <img src="img/welcomeLogo.png" width="395" height="38" alt="welcome" /> 
  <p>Магазинът <a href="http://viki-flowers.com">viki-flowers.com</a> е създадена през 2013 год. като нашата основна цел е да радваме хората с нашите красиви букети, цветя и други много разнообразни по вид подаръци. Ние ще направим за Вас красив и атрактивен букет, с който Вие наистина ще можете да внесете "настроение и красота" във всеки празник, момент или в живота на Вашият любим човек.</p>
  <p>Магазинът ни предлага голямо разнообразие от букети, аранжировки, интересни цветни декорации и още много други цъфтящи идеи.</p>
  <h4>Благодарим Ви, че избрахте нас!</h4>
  </div>
  <div class="separator">
  </div>
<div class="contentRight">
  <img src="img/contactLogo.png" width="231" height="38" alt="contact" />
  <ul>
  <li class="mainContact"><img src="img/flowerIcon.png" width="25" height="19" alt="flower" />Адрес:</li>
  <li>- ул.Вела Чорбова 6, София</li>
  <li class="mainContact"><img src="img/flowerIcon.png" width="25" height="19" alt="flowers" />Телефон:</li>
  <li>- 0889827370</li>
  <li class="mainContact"><img src="img/flowerIcon.png" width="25" height="19" alt="flowers" />E-mail:</li>
  <li>- viki-flowers@gmail.com</li>
  <li class="mainContact"><img src="img/flowerIcon.png" width="25" height="19" alt="flowers" />Skype:</li>
  <li>- viki-flowers</li>
  </ul>
  </div>
</div>
<div id="footer">
</div>
</div>

[css]p,h1,h2,h3,h4,ul,a,img {margin:0; padding:0;}
img {border:none;}

body { background: #fefeec url(../img/background.jpg) no-repeat center top;
font-family:Verdana, Geneva, sans-serif;
font-size:14px;
line-height:1.5em;
text-align:left;
margin:0 auto;
padding:0;
}

#container {width:1000px; height:100%; margin:0 auto;}

#navigation {width:1000px; height:92px; margin:0 auto;}
#navigation ul {list-style-type:none;}
#navigation li {float:left; padding-left:15px; padding-top:50px;}
#navigation ul li.home a { background:url(../img/homebtHover.png) no-repeat; width:83px; height:22px; float:left; padding-left:10px;}
#navigation ul li.about a { background:url(../img/aboutbt.png) no-repeat; width:83px; height:22px; float:left; padding-left:10px;}
#navigation ul li.about a:hover {background:url(../img/aboutbtHover.png) no-repeat; width:83px; height:22px;}
#navigation ul li.contacts a { background:url(../img/contactsbt.png) no-repeat; width:123px; height:23px; float:left; padding-left:10px;}
#navigation ul li.contacts a:hover {background:url(../img/contactsbtHover.png) no-repeat; width:123px; height:23px;}
#navigation ul li.faq a { background:url(../img/faqBt.png) no-repeat; width:280px; height:25px; float:left; padding-left:10px;}
#navigation ul li.faq a:hover {background:url(../img/faqBtHover.png) no-repeat; width:280px; height:25px;}


#slider {width:417px; margin-top:53px;margin-left:auto; margin-right:auto; }
#slider img {padding-top:7px; padding-left:8px; }



#menu {width:800px; margin-top:70px; margin-left:70px;}

#content {width:950px; height:100%; overflow:hidden; margin-top:50px; margin-left:50px;}
.contentLeft {float:left; width:440px;}
.contentLeft h4 {margin-top:5px; color:#63621b;}
.contentLeft a {font-weight:bold; text-decoration:none; color:#000;}
.contentLeft a:visited {font-weight:bold; text-decoration:none; color:#000;}
.contentLeft a:hover {font-weight:bold; text-decoration:none; color:#000;}
.contentLeft a:active {font-weight:bold; text-decoration:none; color:#000;}

.separator { background:url(../img/separator.png) no-repeat; width:53px; height:273px; float:left; margin-left:20px; }

.contentRight {float:right; width:400px;}
.contentRight ul {list-style-type:none;}
.contentRight li {padding-top:3px;}
.contentRight li.mainContact {font-weight:bold; color:#63621b;}

#footer {background:url(../img/footer.png) no-repeat; width:1000px; height:191px; margin-top:20px;}[/css]

Надявам се да ми помогнете , защото ми е важно.
Благодаря предварително за помощта !!!
Поздрави Марко Узунов
 
Не съм ти гледал кода, но като цяло ако си слагаш целия сайт в някакъв див, който е центриран колкото и да смаляваш няма да се размества и винаги ще си стои в центъра
 

Back
Горе