Xpoint
   [напомнить пароль]

Смещение содержимого при изменении масштаба html-страницы

Метки: [без меток]
[удл]
2009-09-12 15:46:44 [обр] Роман[досье]
сообщение промодерировано
При уменьшении масштаба всё содержимое кроме фона смещается влево, а фон остается по центру.
Как сделать, чтобы содержимое при уменьшении тоже оставалось по центру?
Работаю в Dreamweaver CS3.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
  <style type="text/css">
  </style>

  <title>Баня-сруб &quot;СКАЗКА&quot;</title>
  <style type="text/css">
<!--
#apDiv1 {
   position:absolute;
   left:23px;
   top:15px;
   width:221px;
   height:165px;
   z-index:1;
}
#apDiv2 {
   position:absolute;
   left:330px;
   top:251px;
   width:300px;
   height:289px;
   z-index:2;
}
#apDiv3 {
   position:absolute;
   left:0px;
   top:400px;
   width:854px;
   height:370px;
   z-index:3;
   overflow: visible;
}
#apDiv4 {
   position:absolute;
   left:620px;
   top:0px;
   width:800px;
   height:1172px;
   z-index:4;
}
#apDiv5 {
   position:absolute;
   left:593px;
   top:36px;
   width:807px;
   height:100px;
   z-index:5;
}
#apDiv6 {
   position:absolute;
   left:45px;
   top:13px;
   width:573px;
   height:179px;
   z-index:5;
}
#apDiv7 {
   position:absolute;
   left:618px;
   top:949px;
   width:766px;
   height:118px;
   z-index:7;
}
#apDiv8 {
   position:absolute;
   left:629px;
   top:32px;
   width:807px;
   height:105px;
   z-index:6;
}
#apDiv9 {
   position:absolute;
   left:48px;
   top:146px;
   width:659px;
   height:704px;
   z-index:7;
}
#apDiv10 {
   position:absolute;
   left:615px;
   top:163px;
   width:802px;
   height:122px;
   z-index:6;
}
.стиль2 {font-size: x-large}
.стиль3 {font-family: "Times New Roman", Times, serif;
   font-style: italic;}
p {text-indent: 40px;}
#apDiv11 {
   position:absolute;
   left:70px;
   top:592px;
   width:137px;
   height:123px;
   z-index:6;
}
#apDiv12 {
   position:absolute;
   left:360px;
   top:555px;
   width:109px;
   height:168px;
   z-index:7;
}
#apDiv13 {
   position:absolute;
   left:325px;
   top:544px;
   width:38px;
   height:174px;
   z-index:8;
}
.стиль4 {font-family: "Times New Roman"}


-->
  </style>
  <link href="../CSS/fon.css" rel="stylesheet" type="text/css" />


</head>


<body>
<center>


<div style="top: 147px; left: 6px; width: 321px; height: 326px;" id="apDiv1"><a href="../Foto/foto.html"><img src="rama_ok.gif" alt="Фотогаллерея" width="320" height="324" border="0"/></a></div>

<div id="apDiv2"><img src="veniki.gif" alt="Всё о вениках" width="100%" height="100%" /></div>

<div id="apDiv3" style="top: 566px; bottom: auto; height: 659px; width: 1440px;"><img src="kamin_fon_long.gif" width="100%" height="100%" align="absbottom" /></div>

<div id="apDiv4">
  <div class="стиль3" id="apDiv9" style="width:698px; height:907px;">
    <p align="justify" class="стиль4"><span class="стиль2">Баня-сруб «СКАЗКА»</span>,  стилизованная под старину, сделана в наши дни для Вас и Вашего полноценного  отдыха. В срубе Вы чувствуете себя иначе, чем в любом другом доме или квартире.</p>
    <p align="justify" class="стиль4">Дерево способствует легкому полноценному  дыханию. Сруб сам регулирует температуру и влажность воздуха, поэтому летом в  срубе прохладно, а зимой тепло. Невидимые летучие вещества, выделяемые сосновым  срубом полезны для Вашего организма плюс приятные зрительные и тактильные  ощущения. Всё в комплексе – это полный Фэн-Шуй. </p>   
    <p align="justify" class="стиль4"><span class="стиль2">Теперь о бане.</span><br />
      <strong>В  Вашем распоряжении:</strong> <br /></p>
    <div align="justify">
      <ul class="стиль4"><li>большая  трехъярусная универсальная парилка на дровах, где Вы можете париться как в  режиме русской бани с веником, так и финской сауны. Диапазон температур –  60-120градусов<br /> </li>
        <li>вёдра-водопады  – это большие дубовые ведра по 25л. С механизмом самонаполнения, которые  создают приятные контрастные ощущения после парилки. Вода в вёдрах  10-12градусов<br /></li>
        <li>если Вы  экстримал – можете погрузиться в холодный  бассейн с температурой воды  10градусов.<br /></li>
        <li>каминный зал с  ЛСД ТВ, музыкальным центром и самоваром на большом столе где свободно  размещается 8-10, при необходимости и больше.<br /></li>
        <li>комната со  вторым светом, где стоят деревянные лежаки, на которых Вы сможете отдохнуть  после парилки и поиграть в карты или нарды на дубовых креслах…<br /></li>
        <li>спальня с  большой кроватью и отдельным выходом на улицу, удобная раздевалка и туалет<br /></li>
        <li>летняя площадка  с большим мангалом и столом, где в теплое время года Вы можете отдохнуть и  покушать.<br /></li>
        <li>закрытая  парковка на 6-8 авто, где Вы не будете переживать за сохранность своего  четырехколесного друга.<br /></li>
        <li>вся территория  ограждена высоким деревянным забором, чтобы посторонние взгляды не мешали  Вашему отдыху<br /></li>
        <li>услуги банщика  и массажиста (заказывать заранее)<br /></li>
        <li>на  втором этаже двухкомнатный номер люкс с двумя  балконами, санузлом и душем (оплачивается отдельно)</li>
      </ul>
      <p class="стиль4">Вы можете  заказывать чай, кофе, легкие закуски.<br />
        Вы можете  привезти с собой еду, мясо, которые сможете приготовить на нашем мангале.<br />
        Вы можете снять  баню-сруб на 12 часов, сутки и более – цена оговаривается отдельно.<br />
        У нас удобно  праздновать дни рождения, праздники, просматривать футбол и формулу 1.<br />
        В ближайшее время  будет работать кухня</p>
      <p class="стиль4"><strong>Наши цены:</strong><br />
150грн/час в утренние и дневные часы<br />
180 грн в вечерние часы и выходные. <br />
<strong>Для постоянных  клиентов скидка 10%</strong></p>
    </div>
    <p align="justify">&nbsp;</p>
  </div>
  <h2><img src="pergament.gif" width="800px" height="1200px" vspace="0" /></h2>
</div>


<div style="height: 123px;" id="apDiv6"><img src="LOGO.gif" height="120" width="566" /></div>
<div id="apDiv11"><img src="contacts.gif" alt="Контакты" width="137" height="123" /></div>
<div id="apDiv12"><img src="history_ok3.gif" alt="История русской бани" width="109" height="168" /></div>
<div id="apDiv13"><img src="jumor.gif" alt="Банный юмор" width="34" height="170" /></div>
</center>
</body>
</html>
спустя 1 день 18 часов [обр] Ярослав Сюзёв (yara)(36/305)[досье]
М Роман[досье]
Очень мило. Но в вашей портянке вряд ли кто-то будет разбираться.
спустя 34 минуты [обр] Роман[досье]
Ярослав Сюзёв (yara)[досье]
Я вообще-то думал, что форум именно для этого и предназначен...
Но в любом случае спасибо за столь содержательный и полезный ответ!..
спустя 1 час [обр] Lynn «Кофеман»(56/571)[досье]
сообщение промодерировано

Роман[досье]
Лучше сразу приводить ссылку на тестовую страницу, потому что:
Во-первых, что бы проверить вашу портянку сейчас мне нужно скопировать её текст в редактор, сохранить и открыть в браузере, вместо того, что бы просто открыть ссылку.
Во-вторых никому не нужно будет догадываться, что же написано в файле ../CSS/fon.css и как выглядят картинки.
В-третьих, это вам нужен ответ, а не нам.

Впрочем, в данном случает ответ очевиден, не пишите html в безумных визуальных редакторах. У вас каждый блок спозиционирован абсолютно (если вам это что-то говорит), т.е. по сути отстоит от левого края страницы на некоторое расстояние и при масштабировании это расстояние естественно уменьшается, а где у вас там фон, я так и не понял.

спустя 2 дня 1 час [обр] Роман[досье]
Lynn «Кофеман»[досье]
Ссылка на страницу www.skazkasrub.com.ua
Без "безумного визуального редактора" у меня и этого не получилось бы... это мой первый сайт...
спустя 3 года 10 месяцев [обр] Axel[досье]
Некропостеры, но всеже напишу. Заключить все дивы в новый див и выставить ему расположение слева в процентах, что-то типа left:30%; Подогнать проценты, чтобы расположение при масштабировании оказалось по центру. Готово.
Powered by POEM™ Engine Copyright © 2002-2005