Элементы подменю - уменьшить расстояние между ними

Тема в разделе "Создание шаблона", создана пользователем JDV, 06.11.2010.

  1. Offline

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

    Регистрация:
    03.11.2007
    Сообщения:
    7
    Симпатии:
    0
    Пол:
    Мужской
    Добрый день Уважаемые коллеги ... Не подскажите как уменьшить расстояние между подчинёнными элементами меню InDoor Tools, OutDoor Tools расположенного слева ... см. http://www.7od.ru/index.php?option=com_virtuemart&Itemid=57

    Power Tools

    OutDoor Tools

    InDoor Tools


    Garden Tools

    CSS

    Код (CODE):
    1. /* Design by Brian Diaz of Media 65 @ http://www.m65.net  All Rights Reserved */
    2. @import url(layouts.css);
    3. @import url(components.css);
    4. @import url(modules.css);
    5. @import url(navigation.css);
    6. @import url(misc.css);
    7. @import url(forms.css);
    8.  
    9.  
    10. /* #######################  GENERAL SETTINGS ############################ */
    11. html.body{
    12.     font-family: arial, helvetica, sans-serif;
    13.     font-size: 12px;
    14.     margin-top: 0px;
    15. }
    16.  
    17. body {
    18.     font-family: arial, helvetica, sans-serif;
    19.     font-size: 12px;
    20.     color: #666;
    21.     margin-top: 0px;
    22.     }
    23.    
    24. .top_left{
    25.     background-image: url(../images/top_left.png);
    26.     background-repeat: no-repeat;
    27.     height: 31px;
    28.     width: 692px;
    29. }
    30. .top_right{
    31.     background-image: url(../images/top_right.png);
    32.     background-repeat: no-repeat;
    33.     height: 31px;
    34.     width: 350px;  
    35. }
    36. .top_center{
    37.     background-image: url(../images/head_banner.png);
    38.     background-repeat: no-repeat;
    39.     height: 203px;
    40.     width: 1042px;
    41. }
    42.  
    43. .footer_menu{
    44.     background-image: url(../images/--menu_footer.png);
    45.     background-repeat: no-repeat;
    46.     height: 105px;
    47.     width: 1042px;
    48. }
    49. .footer_left{
    50.     background-image: url(../images/footer_left.png);
    51.     background-repeat: no-repeat;
    52.     height: 86px;
    53.     width: 211px;
    54. }
    55. .footer_right{
    56.     background-image: url(../images/footer_right.png);
    57.     background-repeat: no-repeat;
    58.     height: 86px;
    59.     width: 833px;
    60. }
    61. .top_right div {
    62.     color: #000;
    63. }
    64. .c_content{
    65.     padding-left:5px;
    66.         padding-right: 5px;
    67.     padding-top: 5px;
    68. }
    69.  
    70. .cellsBlock {
    71.   width: 100%;
    72.   display: table;
    73. }
    74. .cellLeft, .cellMiddle, .cellRight {
    75.   display: table-cell !important;
    76.   display: inline; /*  */
    77. }
    78. .cellLeft, .cellRight {
    79.   width:35%;
    80. }
    81. .cellMiddle {
    82.   width:30%;
    83. }
    84. .telefon_icq {
    85. font-size: 12px;
    86. font-weight: bold;
    87. text-align: left;
    88. color: #000000;
    89.  
    90. }
    91. .name_user_log{
    92. padding-top: 3px;
    93. }
    94.  
    95.  
    96. /* Block Right LOGIN JDV*/
    97.  
    98. .block-right{
    99.  
    100. width: 213px;
    101. }
    102.  
    103. .block-right div.module-login {
    104. background: url(../images/bottom_left_login.png) no-repeat;
    105. background-position: bottom left;
    106. }
    107.  
    108. .block-right div.module-login div {
    109. background: url(../images/bottom_right_login.png) no-repeat;
    110. background-position: bottom right;
    111. }
    112.  
    113. .block-right div.module-login div div{
    114. background: url(../images/left_login.png) no-repeat;
    115. background-position: top left;
    116. }
    117.  
    118. .block-right div.module-login div div div {
    119. background: url(../images/right_login.png) no-repeat;
    120. background-position: top right;
    121. padding-top: 20px;
    122. padding-left: 10px;
    123. /*padding-right: 10px;*/
    124. padding-bottom: 20px;
    125. width: auto !important;
    126. width: 100%;
    127. font-family: arial, helvetica, sans-serif;
    128. }
    129.  
    130. .block-right div.module-login div div div h3{
    131. margin-top: -9px;
    132. color: #FFF;
    133. text-align: center;
    134. text-transform: uppercase;
    135. width: auto !important;
    136. width: 100%;
    137. font-family: arial, helvetica, sans-serif;
    138. }
    139.  
    140.  
    141.  
    142. /* Block Right JDV*/
    143.  
    144.  
    145. .block-right div.module-right {
    146. background: url(../images/right_block_left_bottom.png) no-repeat;
    147. background-position: bottom left;
    148. }
    149.  
    150. .block-right div.module-right div {
    151. background: url(../images/right_block_right_bottom.png) no-repeat;
    152. background-position: bottom right;
    153. }
    154.  
    155. .block-right div.module-right div div{
    156. background: url(../images/right_block_left_top.png) no-repeat;
    157. background-position: top left;
    158. }
    159.  
    160. .block-right div.module-right div div div {
    161. background: url(../images/right_block_right_top.png) no-repeat;
    162. background-position: top right;
    163. padding-top: 20px;
    164. padding-left: 8px;
    165. /*padding-right: 10px;*/
    166. padding-bottom: 35px;
    167. width: auto !important;
    168. width: 100%;
    169. font-family: arial, helvetica, sans-serif;
    170. }
    171.  
    172. .block-right div.module-right div div div h3{
    173. margin-top: -9px;
    174. color: #FFF;
    175. text-align: center;
    176. text-transform: uppercase;
    177. width: auto !important;
    178. width: 100%;
    179. font-family: arial, helvetica, sans-serif;
    180. }
    181.  
    182. /*Block Left JDV*/
    183.  
    184. .block{
    185. width: 240px;
    186. }
    187.  
    188.  
    189. .block div.module {
    190. background: url(../images/left_bottom_m.png) no-repeat;
    191. background-position: bottom left;
    192. }
    193.  
    194. .block div.module div {
    195. background: url(../images/right_bottom_m.png) no-repeat;
    196. background-position: bottom right;
    197. }
    198.  
    199. .block div.module div div{
    200. background: url(../images/left_top_m.png) no-repeat;
    201. background-position: top left;
    202. }
    203.  
    204. .block div.module div div div {
    205. background: url(../images/right_top_m.png) no-repeat;
    206. background-position: top right;
    207. padding-top: 25px;
    208. padding-bottom: 35px;
    209. width: auto !important;
    210. width: 100%;
    211. font-family: arial, helvetica, sans-serif;
    212. }
    213.  
    214. .block div.module div div div h3{
    215. margin-top: -9px;
    216. color: #FFF;
    217. text-align: center;
    218. text-transform: uppercase;
    219. width: auto !important;
    220. width: 100%;
    221. font-family: arial, helvetica, sans-serif;
    222. }
    223. .block div.module div div div div{
    224. background: none;
    225. }
    226. /*for menu JDV*/
    227.  
    228. .block div.module_menu {
    229. background: url(../images/left_bottom_m.png) no-repeat;
    230. background-position: bottom left;
    231. }
    232.  
    233. .block div.module_menu div {
    234. background: url(../images/right_bottom_m.png) no-repeat;
    235. background-position: bottom right;
    236. }
    237.  
    238. .block div.module_menu div div{
    239. background: url(../images/left_top_m.png) no-repeat;
    240. background-position: top left;
    241. }
    242.  
    243. .block div.module_menu div div div {
    244. background: url(../images/right_top_m.png) no-repeat;
    245. background-position: top right;
    246. width: auto !important;
    247. width: 100%;
    248. padding-top: 25px;
    249. padding-bottom: 35px;
    250. padding-right: 10px;
    251. padding-left: 10px;
    252. font-family: arial, helvetica, sans-serif;
    253. }
    254.  
    255. .block div.module_menu div div div h3{
    256. margin-top: -9px;
    257. color: #FFF;
    258. text-align: center;
    259. text-transform: uppercase;
    260. width: auto !important;
    261. width: 100%;
    262. font-family: arial, helvetica, sans-serif;
    263. }
    264.  
    265. .block div.module_menu div div div div{
    266. background: none;
    267. }
    268.  
    269.  
    270. /* (MENU) */
    271. .mainlevel-left{
    272. margin-top: 10px;
    273. }
    274. a.mainlevel{
    275.     background-repeat: no-repeat;
    276.     background-position: left;
    277. }
    278.  
    279. a.mainlevel-left:link {
    280.     background-image: url(../images/strela.png);
    281.     background-repeat: no-repeat;
    282.     background-position: left;
    283.     font-family: arial, helvetica, sans-serif;
    284.     font-size: 12px;
    285.     color: #777777;
    286.     font-style: normal;
    287.     text-decoration: none;
    288.     padding-top: 6px;
    289.     padding-bottom: 5px;
    290.     text-align: left;
    291.     display: block;
    292.     padding-left: 14px;
    293.     margin-right: 10px;
    294.     text-transform: uppercase;
    295.     border-bottom: 1px dotted #CCCCCC;
    296. }
    297. a.mainlevel-left:visited {
    298.  
    299.     background-image: url(../images/strela.png);
    300.     background-repeat: no-repeat;
    301.     background-position: left;
    302.     font-family: arial, helvetica, sans-serif;
    303.     font-size: 12px;
    304.     color: #777777;
    305.     font-style: normal;
    306.     text-decoration: none;
    307.     display: block;
    308.     padding-top: 6px;
    309.     padding-bottom: 5px;
    310.     text-align: left;
    311.     padding-left: 14px;
    312.     margin-right: 10px;
    313.     text-transform: uppercase;
    314.     border-bottom: 1px dotted #CCCCCC;
    315. }
    316. a.mainlevel-left:hover {
    317.  
    318.     background-image: url(../images/strela.png);
    319.     background-repeat: no-repeat;
    320.     background-position: left;
    321.     font-family: arial, helvetica, sans-serif;
    322.     font-size: 12px;
    323.     color: #00A9DD;
    324.     font-style: normal;
    325.     text-decoration: none;
    326.     padding-top: 6px;
    327.     padding-bottom: 5px;
    328.     text-align: left;
    329.     display: block;
    330.     padding-left: 14px;
    331.     margin-right: 10px;
    332.     text-transform: uppercase;
    333.     border-bottom: 1px dotted #CCCCCC;
    334.  
    335. }
    336.  
    337. /*sublevel-left*/
    338. .sublevel-left{
    339. }
    340. a.sublevel-left:link{
    341.     border-bottom: 1px dotted #CCCCCC;
    342.     font-size: 12px;
    343.     color: #777777;
    344.     display: block;
    345.     font-style: normal;
    346.     text-decoration: none;
    347. }
    348. a.sublevel-left:visited{
    349.     border-bottom: 1px dotted #CCCCCC;
    350.     font-size: 12px;
    351.     color: #777777;
    352.     display: block;
    353.     font-style: normal;
    354.     text-decoration: none;
    355. }
    356. a.sublevel-left:hover{
    357.     border-bottom: 1px dotted #CCCCCC;
    358.     font-size: 12px;
    359.     color: #00A9DD;
    360.     display: block;
    361.     font-style: normal;
    362.     text-decoration: none;
    363.  
    364. }
    365. a.mainlevel-left#active_menu-left {
    366.     color: #00A9DD;
    367. }
    368. a.sublevel-left#active_menu-left {
    369.     color: #00A9DD;
    370. }
    371.  
    372.  
    373. #active_menu {} /*  main/sub*/
    374.  
    375. ul#mainlevel-nav {}
    376. ul#mainlevel-nav li{}
    377.  
    378. #mainlevel-nav {
    379. margin:0px;
    380. margin-top: -1px;
    381.  
    382. }
    383.  
    384. #mainlevel-nav a:link {
    385. font-size:12px;
    386. color:#FFFFFF;
    387. display:block;
    388. text-align:center;
    389. float:left;
    390. text-decoration: none;
    391. padding-left: 25px;
    392. text-transform: uppercase;
    393. font-family: arial, helvetica, sans-serif;
    394. }
    395.  
    396. #mainlevel-nav a:visited{
    397. font-size:12px;
    398. color:#FFFFFF;
    399. display:block;
    400. text-align:center;
    401. float:left;
    402. text-decoration: none;
    403. padding-left: 25px;
    404. text-transform: uppercase;
    405. font-family: arial, helvetica, sans-serif;
    406. }
    407.  
    408. #mainlevel-nav a:hover {
    409. font-size:12px;
    410. color:#FFFFFF;
    411. display:block;
    412. text-align:center;
    413. float:left;
    414. text-decoration: none;
    415. padding-left: 25px;
    416. text-transform: uppercase;
    417. font-family: arial, helvetica, sans-serif;
    418. }
    419.  
    420.  
    421. #mainlevel-nav-footer {
    422. margin-top: 10px;
    423.  
    424. }
    425.  
    426. #mainlevel-nav-footer a:link {
    427. font-size:12px;
    428. color:#FFFFFF;
    429. display:block;
    430. text-align:center;
    431. float:left;
    432. text-decoration: none;
    433. padding-top: 25;
    434. padding-left: 25px;
    435. text-transform: uppercase;
    436. font-family: arial, helvetica, sans-serif;
    437. }
    438.  
    439. #mainlevel-nav-footer a:visited{
    440. font-size:12px;
    441. color:#FFFFFF;
    442. display:block;
    443. text-align:center;
    444. float:left;
    445. text-decoration: none;
    446. padding-top: 25;
    447. padding-left: 25px;
    448. text-transform: uppercase;
    449. font-family: arial, helvetica, sans-serif;
    450. }
    451. #mainlevel-nav-footer a:hover {
    452. font-size:12px;
    453. color:#FFFFFF;
    454. display:block;
    455. text-align:center;
    456. float:left;
    457. text-decoration: none;
    458. padding-top: 25;
    459. padding-left: 25px;
    460. text-transform: uppercase;
    461. font-family: arial, helvetica, sans-serif;
    462. }
    463.  
    464.  
    465. #form-login{
    466. padding-top: 15px;
    467.    
    468. }
    469.  
    470. /*  Global Formatting */
    471. h1 {
    472.     font-family: arial, helvetica, sans-serif;
    473.     font-size: 16px;
    474.     color: #000000;
    475.     font-style: normal;
    476.     font-weight: bold;
    477. }
    478. h2 {font-size:15px;line-height: 1em;font-weight: 900;}
    479. h3 {font-size:14px;line-height: 1em;font-weight: 900;}
    480. h4 {
    481.     font-family: arial, helvetica, sans-serif;
    482.     font-size: 16px;
    483.     color:  #AE2924;
    484.     font-style: normal;
    485.     font-weight: bold;
    486.  
    487. }
    488. h5 {font-size:12px;line-height: 1em;font-weight: 900;}
    489. h6 {font-size:11px;line-height: 1em;font-weight: 900;}
    490. td{
    491.     font-family: arial, helvetica, sans-serif;
    492.     font-style: normal;
    493.     font-weight: normal;
    494.     font-variant: normal;
    495.     color: #000000;
    496.     font-size: 12px;
    497.     text-align: left;
    498.     }
    499.    
    500. th{
    501.     font-family: arial, helvetica, sans-serif;
    502.     font-style: normal;
    503.     font-weight: normal;
    504.     font-variant: normal;
    505.     color: #000000;
    506.     font-size: 12px;
    507.     text-align: left;
    508.     }
    509. a:link {color: #4d4a4a;
    510. font-weight: bold;}
    511. a:hover {color: #4d4a4a;
    512. font-weight: bold;}
    513. a:visited {color: #4d4a4a;
    514. font-weight: bold;}
    515. img {border: 0 none;
    516. font-weight: bold;}
    517.  
    518. p {
    519.     font-family: arial, helvetica, sans-serif;
    520.     font-style: normal;
    521.     font-weight: normal;
    522.     font-variant: normal;
    523.     color: #000000;
    524.     font-size: 12px;
    525.     text-align: left;
    526. }
    527.  
    528. /* Clears Divs */
    529. .clr{clear: both;}
    530.  
    531. /* #######################  END GENERAL SETTINGS ############################ */


    Index
    Код (CODE):
    1. <?php
    2. /*
    3. * @copyright    Copyright (C) 2008 - 2009 All rights reserved.
    4. * @license     
    5. */
    6. // no direct access
    7. defined( '_JEXEC' ) or die( 'Restricted access' );
    8. ?>
    9. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    10. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
    11. <head>
    12. <jdoc:include type="head" />
    13. <link rel="stylesheet" href="<?php echo $this->baseurl ;?>/templates/system/css/system.css" type="text/css" />
    14. <link rel="stylesheet" href="<?php echo $this->baseurl ;?>/templates/system/css/general.css" type="text/css" />
    15. <link rel="stylesheet" href="<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>/css/template.css" type="text/css" />
    16.  <?php
    17.    if (file_exists(JPATH_SITE.DS.'components'.DS.'com_joomlastats'.DS.'joomlastats.inc.php'))
    18.        include_once(JPATH_SITE.DS.'components'.DS.'com_joomlastats'.DS.'joomlastats.inc.php');
    19.    ?>
    20.  
    21. </head>
    22.  
    23. <body>
    24. <table width="1042" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="3B3B3B">
    25. <tr>
    26.     <td width="692"  class="top_left"><div id="mainlevel-nav"><jdoc:include type="modules" name="top" /></div></td>
    27.     <td width="350"  colspan="2" class="top_right"><div><jdoc:include type="modules" name="user1" /></div></td>
    28.   </tr>
    29.     <tr>
    30.       <td  colspan="3" class="top_center"></td>
    31.     </tr>
    32. </table>
    33. <table width="1042" border="0" align="center" cellpadding="0" cellspacing="0">
    34.   <tbody>
    35.     <tr>
    36.       <td width="240"  valign="top">
    37.         <div class="block">
    38.             <jdoc:include type="modules" name="left" style="rounded"/>
    39.         </div>
    40.       </td>
    41.       <td width="589" valign="top"><div class="c_content"><jdoc:include type="component" /></div></td>
    42.       <td width="213" align="right" valign="top">
    43.       <div class="block-right">
    44.           <jdoc:include type="modules" name="right" style="rounded"/>
    45.       </div>
    46.       </td>
    47.     </tr>
    48.   </tbody>
    49. </table>
    50. <table width="1042" border="0" align="center" cellpadding="0" cellspacing="0">
    51.     <tr>
    52.       <td  width="1042" align="center" valign="top" class="footer_menu">
    53.         <div id="mainlevel-nav-footer">
    54.             <jdoc:include type="modules" name="user3"/>
    55.         </div>
    56.       </td>
    57. </tr>
    58. </table>
    59. <table width="1043" border="0" align="center" cellpadding="0" cellspacing="0">
    60.     <tr>
    61.       <td  width="211" align="left" valign="top" class="footer_left"><jdoc:include type="modules" name="user4"/></td>
    62.       <td  width="834" align="left" valign="top" class="footer_right"><jdoc:include type="modules" name="footer"/></td>
    63. </tr>
    64. </table>
    65. </body>
    66.  
    67. </html>
     
    JDV, 06.11.2010
    #1

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

     
  3. Offline

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

    Регистрация:
    26.11.2010
    Сообщения:
    9
    Симпатии:
    0
    Пол:
    Мужской
    найди через firebug какое точно меню в css
    и добавь padding-top: 5; }
    лично у меня для примера это #mainlevel li a, .menu li
    в menus.css
     
    nanobot, 30.11.2010
    #2
< вывод статьи | Шаблон Brilliant (первый габлон для Joomla) >

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

Загрузка...