Вставка <jdoc:include type="component" /> в центральный блок создает разрыв между верхним и средним

Тема в разделе "Создание шаблона", создана пользователем Михай, 23.08.2013.

  1. Offline

    Михай Недавно здесь

    Регистрация:
    01.12.2009
    Сообщения:
    28
    Симпатии:
    0
    Пол:
    Мужской
    Здравствуйте! У мня Джумла 1.7, Win 7 и WAMPSERVER. При создании шаблона возникает такая беда как написано в заголовке.
    Конкретнее:index.php -
    Код (CODE):
    1. <body>
    2.   <div id="wrapper">
    3.       <div id="header">
    4.           <div id="logo"><jdoc:include type="modules" name="logo" /></div>
    5.             <div id="find"><jdoc:include type="modules" name="find" /></div>
    6.         </div>
    7.     <div id="menu"><jdoc:include type="modules" name="menu" /></div>
    8.  
    9.  
    10.          
    11.     <div id="content">
    12.           <div id="left"><jdoc:include type="modules" name="left" />
    13.         <div id="login"><jdoc:include type="modules" name="login" /></div>
    14.       </div>
    15.             <div id="right"><jdoc:include type="modules" name="right" /></div>
    16.  
    17. /* Вот здесь я вставляю <jdoc:include type="component" /> и сайт раделяется на верх и низ разрыв в виде горизнтальной полосы 20px */
    18.  
    19.             <div id="center"><jdoc:include type="component" /></div>
    20.            
    21.         </div>
    22.        
    23.         <div id="footer"><jdoc:include type="modules" name="footer" /></div>
    24.     </div>
    25. </body>
    26. </html>


    Вставка всех <jdoc:include type="modules" name="......" /> не меняет вид сайта.

    и к нему простенькая CSS:
    Код (CODE):
    1. @charset "utf-8";
    2. /* CSS Document */
    3. body {
    4.     margin:0;
    5.     padding:0;
    6.     font-size:9pt; color:red; font-family:Microsoft Sans Serif;
    7. }
    8.  
    9. div#wrapper {
    10.     margin:0 auto;
    11.     width:1000px;
    12.     height:600px;
    13.    
    14. }
    15.  
    16. div#header {
    17.     height:100px;
    18.     width:1000px;
    19. }
    20.  
    21. div#logo {
    22.     height:100px;
    23.     width:700px;
    24.     float:left;
    25.     background:#F00;
    26. }
    27.  
    28. div#find {
    29.     width:300px;
    30.     height:100px;
    31.     margin-left:700px;
    32.     background:#FF0;
    33. }
    34.  
    35. div#menu {
    36. width: 1000px;
    37. height: 75px;
    38. background:#0F0;
    39. }
    40.  
    41. /* Здесь воникает разрыв при вставке <jdoc:include type="component" /> в блок center (см. ниже) */
    42.  
    43. div#content {
    44.     width:1000px;
    45.     height:350px;
    46.     margin:0px;
    47. }
    48.  
    49. div#left {
    50.     width:300px;
    51.     height:350px;
    52.     float:left;
    53.     background:#00F;
    54. }
    55.  
    56. div#login {
    57.     width:300px;
    58.     height:70px;
    59.     position: relative; /* Абсолютное позиционирование */
    60.     top: 280px; /* Положение от нижнего края */
    61.     left: 0px;
    62.     background:#0FF;
    63. }
    64.  
    65.  
    66. div#right {
    67.     width:200px;
    68.     height:350px;
    69.     float:right;
    70.     background:#00F;
    71. }
    72.  
    73. div#center {
    74.     width:600px;
    75.     height:350px;
    76.     background:#CCC;
    77.     margin:0 200px;
    78. }
    79.  
    80.  
    81.  
    82. div#footer {
    83.     width:1000px;
    84.     height:75px;
    85.     background:#0F0;
    86. }


    Кто может что-то посоветовать или хоь объяснить, буду очень благодарен.
    Спасибо.

    Вот так меняется вид сайта:
     

    Вложения:

  2.  

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

Загрузка...