Joomla 1.0 Как расположить сайт ровно по середине экрана

Тема в разделе "Изменение шаблона (кастомизация)", создана пользователем EPIX, 31.10.2008.

  1. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Сам сайт 1000х700 пикселей, не может быть больше или меньше. Как расположить его ровно по середине экрана и чтобы он всегда по середине и оставался, независимо от разрешения монитора? причем посередине как справа и лева, так и сверху и снизу.
     
    EPIX, 31.10.2008
    #1

  2. Наши спонсоры

     
  3. Offline

    _voland_ Местный => Cпециалист <=

    Регистрация:
    12.04.2008
    Сообщения:
    2 171
    Симпатии:
    102
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    <body><center><div id="123"> .... </div></center></body>

    div#123 {height: auto !important; height:700px; width:1000px; min-height:700px}

    Примерно так, точно не тестировал
     
    Последнее редактирование: 31.10.2008
    _voland_, 31.10.2008
    #2
  4. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    не сработало =(
     
    EPIX, 31.10.2008
    #3
  5. Fanamura
    Offline

    Fanamura Доброта

    Регистрация:
    12.03.2007
    Сообщения:
    5 094
    Симпатии:
    158
    Пол:
    Мужской
    Fanamura, 01.11.2008
    #4
    Wild Tiger нравится это.
  6. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    А как сделать тоже самое, только не просто по-центру слева и права, а еще и по центру снизу и сверху. И не относительно блока, как показано на примере, а относительно разрешения монитора?
     
    EPIX, 02.11.2008
    #5
  7. Offline

    _voland_ Местный => Cпециалист <=

    Регистрация:
    12.04.2008
    Сообщения:
    2 171
    Симпатии:
    102
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    Вот пример http://cssing.org.ua/examples/valign1/index1.html
     
    _voland_, 03.11.2008
    #6
  8. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    Вот именно так и нужно. Решения еще не нашел.
     
    EPIX, 04.11.2008
    #7
  9. Offline

    _voland_ Местный => Cпециалист <=

    Регистрация:
    12.04.2008
    Сообщения:
    2 171
    Симпатии:
    102
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    Как не нашел.. в этом примере никто не запрещает посмотреть исходник и css!
     
    _voland_, 04.11.2008
    #8
    EPIX нравится это.
  10. artlebsak
    Offline

    artlebsak Папа Джум ™

    Регистрация:
    13.04.2007
    Сообщения:
    476
    Симпатии:
    14
    Пол:
    Мужской
    Re: сайт ровно по середине экрана

    EPIX, как это решение не нашёл?
    _voland_, же готовое решение показал! В исходный код загляни - там даже комментарии на русском.
    Код (html):
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    2.        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. <html xmlns="http://www.w3.org/1999/xhtml">
    4. <head>
    5. <title>akella's template</title>
    6. <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    7. <style type="text/css">
    8. /*<![CDATA[*/
    9. /*стили для красоты*/
    10. body{
    11.     text-align:center;
    12.     font:.8em/1.3 Arial,sans-serif;
    13.     background:#fff url(center.png) no-repeat 50% 50%;
    14.     }
    15. #centered{
    16.     background:black;
    17.     width:600px;
    18.     color:#fff;
    19.     margin: 0 auto;
    20.     padding:15px;
    21.     }
    22. /*Вертикальное центрирование для нормальных броузеров*/
    23. html, body {
    24.     height: 100%;
    25.     margin: 0;
    26.     padding: 0;
    27.     }
    28. body {
    29.     display: table;
    30.     height: 100%;
    31.     width: 100%;
    32.     text-align: center;
    33.     }
    34. #wrapper {
    35.     display: table-cell;
    36.     vertical-align: middle;
    37.     }
    38. /*]]>*/
    39. </style>
    40. <!-- Симуляция вертикального выравнивания для ИЕ. -->
    41. <!--[if IE]>
    42. <style type="text/css">
    43. /* ==== решение ==== */
    44.  
    45. div#centered {margin-top: expression(((document.documentElement.offsetHeight/2)
    46. -parseInt(offsetHeight)/2)  <0 ? "0" :
    47. (document.documentElement.offsetHeight/2)
    48. -(parseInt(offsetHeight)/2)  +'px') ;}
    49. /* статья на английском: <http://www.gunlaug.no/contents/wd_additions_20.html> о вертикальном выравнивании
    50. и по русски:  http://cssing.org.ua/2007/04/26/another-css-valign-method/  */
    51. /* Преимуществом этого подхода является то,  что нам не нужно указывать высоту в expression, а только в CSS,
    52. IE сам определит высоту и рассчитает margin-top. */
    53.  
    54. </style>
    55. <![endif]-->
    56. </head>
    57. <body>
    58.     <!-- BEGIN #wrapper -->
    59.     <div id="wrapper">
    60.         <div id="centered"><p>Остальная пехота поспешно проходила по мосту, спираясь воронкой у входа. Наконец повозки все прошли, давка стала меньше, и последний батальон вступил на мост. Одни гусары эскадрона Денисова оставались по ту сторону моста против неприятеля. Неприятель, вдалеке видный с противоположной горы, снизу, от моста, не был еще виден, так как из лощины, по которой текла река, горизонт оканчивался противоположнымвозвышением не дальше полуверсты. Впереди была пустыня, по которой кое-где шевелились кучки наших разъездных казаков. Вдруг на противоположном возвышении дороги показались войска в синих капотах и артиллерия. </p></div>
    61.  
    62.     </div>
    63.     <!-- END #wrapper -->
    64. </body>
    65. </html>

    Да, объявления стандартов в самом начале файла имеет значение.
     
    artlebsak, 04.11.2008
    #9
    EPIX нравится это.
  11. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Ladm, _voland_, действительно, благодарю вас, получилось ))))
     
    EPIX, 18.11.2008
    #10
  12. EPIX
    Offline

    EPIX Недавно здесь

    Регистрация:
    20.10.2008
    Сообщения:
    24
    Симпатии:
    0
    Пол:
    Мужской
    Вот еще вопрос касательно этой темы. когда сайт выключен или недоступен, при заходе на сайт появляется табличка, информирующая об этом обычных посетителей. где она конкретно находится для того, чтобы ее подредактировать? то есть я хочу эти таблички сделать тоже по-середине экрана, а место их дислокации (место откуда они загружаются) не нашел, подскажите его пожалуйста.
     
    EPIX, 20.11.2008
    #11
  13. Fanamura
    Offline

    Fanamura Доброта

    Регистрация:
    12.03.2007
    Сообщения:
    5 094
    Симпатии:
    158
    Пол:
    Мужской
    EPIX, ищи фаилик offline.php
     
    Fanamura, 20.11.2008
    #12
< Как убрать "Краткие новости" из JSN Epic PRO | Стандартный компонент баннеров, border у баннера, как убрать? >

Поделиться этой страницей

Загрузка...