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

Discussion in 'Изменение шаблона (кастомизация)' started by EPIX, Oct 31, 2008.

  1. EPIX
    Offline

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Сам сайт 1000х700 пикселей, не может быть больше или меньше. Как расположить его ровно по середине экрана и чтобы он всегда по середине и оставался, независимо от разрешения монитора? причем посередине как справа и лева, так и сверху и снизу.
     
    EPIX, Oct 31, 2008
    #1

  2. Ads Master

     
  3. Offline

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

    Joined:
    Apr 12, 2008
    Messages:
    2,171
    Likes Received:
    102
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

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

    Примерно так, точно не тестировал
     
    Last edited: Oct 31, 2008
    _voland_, Oct 31, 2008
    #2
  4. EPIX
    Offline

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

    Fanamura Доброта

    Joined:
    Mar 12, 2007
    Messages:
    5,094
    Likes Received:
    158
    Gender:
    Male
    Fanamura, Nov 1, 2008
    #4
    Wild Tiger likes this.
  6. EPIX
    Offline

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

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

    Joined:
    Apr 12, 2008
    Messages:
    2,171
    Likes Received:
    102
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

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

    Joined:
    Apr 12, 2008
    Messages:
    2,171
    Likes Received:
    102
    Gender:
    Male
    Re: сайт ровно по середине экрана

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

    artlebsak Папа Джум ™

    Joined:
    Apr 13, 2007
    Messages:
    476
    Likes Received:
    14
    Gender:
    Male
    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, Nov 4, 2008
    #9
    EPIX likes this.
  11. EPIX
    Offline

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Ladm, _voland_, действительно, благодарю вас, получилось ))))
     
    EPIX, Nov 18, 2008
    #10
  12. EPIX
    Offline

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

    Joined:
    Oct 20, 2008
    Messages:
    24
    Likes Received:
    0
    Gender:
    Male
    Вот еще вопрос касательно этой темы. когда сайт выключен или недоступен, при заходе на сайт появляется табличка, информирующая об этом обычных посетителей. где она конкретно находится для того, чтобы ее подредактировать? то есть я хочу эти таблички сделать тоже по-середине экрана, а место их дислокации (место откуда они загружаются) не нашел, подскажите его пожалуйста.
     
    EPIX, Nov 20, 2008
    #11
  13. Fanamura
    Offline

    Fanamura Доброта

    Joined:
    Mar 12, 2007
    Messages:
    5,094
    Likes Received:
    158
    Gender:
    Male
    EPIX, ищи фаилик offline.php
     
    Fanamura, Nov 20, 2008
    #12
< Как убрать "Краткие новости" из JSN Epic PRO | Стандартный компонент баннеров, border у баннера, как убрать? >

Share This Page

Loading...