Jump to content

Recommended Posts

Проблема в следующем: см. скрин:

34yxnwz.jpg

Это верхнее горизонтально меню. Стоит ocstore 1.5.1.3

Код этого куска выглядит след. образом:

<li>
<a href="ххх/">Концевые выключатели</a>
<div style="margin-left: -62px;">
<ul>
<li>
<a href="ххх/">Промфактор концевые выключатели (10)</a>
</li>
</ul>
</div>
</li>

Смещение дочернего блока происходит как раз из-за margin-left: -62px;

Если прямо в браузере поправить это значение на -66px, то все становится на свои места:

29az7zr.jpg

Все бы хорошо, но я никак не могу найти, где генерируется или откуда берется это значение?! В CSS его нету, в header.tpl тоже... Да и вообще оно появляется только на крайнем элементе меню, на остальных <div> идет без стилей..

Share this post


Link to post
Share on other sites

ссылку на сайт дайте, посмотрим

Share this post


Link to post
Share on other sites

найдите и подправьте в stylesheet.css параметр:

 #menu > ul > li > div {left:-5px;}

однако, это кривой костыль.

У вас в файле шаблона стили применяются, что не есть гуд.

Share this post


Link to post
Share on other sites

У вас в файле шаблона стили применяются, что не есть гуд.

можно, пожалуйста, детальнее, где именно? я вижу, что некоторые отдельные элементы имеют свои стили, но вроде глобальных вставок CSS нету. или я что-то упустил?

upd:

подправил праметр, как Вы сказали. с left:-5px; вообще ничего не произошло, а с margin-left:-5px; поплыли все дочерние пункты меню.. ((

Edited by drewz

Share this post


Link to post
Share on other sites

видимо, в блоке, отвечающем за вывод подменю. Я вижу там встроеный стиль.

Он-то и забивает css. Покажите, что у вас в header.tpl после

<div id="menu">

Share this post


Link to post
Share on other sites

вот. дальше ничего нету

<?php if ($categories) { ?>
<div id="menu">
 <ul>
   <?php foreach ($categories as $category) { ?>
   <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
  <?php if ($category['children']) { ?>
  <div>
    <?php for ($i = 0; $i < count($category['children']);) { ?>
    <ul>
	  <?php $j = $i + ceil(count($category['children']) / $category['column']); ?>
	  <?php for (; $i < $j; $i++) { ?>
	  <?php if (isset($category['children'][$i])) { ?>
	  <li><a href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name']; ?></a></li>
	  <?php } ?>
	  <?php } ?>
    </ul>
    <?php } ?>
  </div>
  <?php } ?>
   </li>
   <?php } ?>
 </ul>
</div>
<?php } ?>
<div id="line"></div>
<div id="notification"></div>

Share this post


Link to post
Share on other sites

Да и вообще оно появляется только на крайнем элементе меню, на остальных <div> идет без стилей..

Ан нет. На предпоследнем пункте вижу

margin-left: -113px;

Так что это какое-то очень сильное колдунство.

Share this post


Link to post
Share on other sites

Ан нет. На предпоследнем пункте вижу

margin-left: -113px;

Так что это какое-то очень сильное колдунство.

действительно...я и не заметил..

колдунство очень сильное, только где от него ноги растут? )

Share this post


Link to post
Share on other sites

И колдунство, видимо, заключается в

#menu > ul > li:hover

там бордер 2 пикселя толщиной. Думается мне, что загвоздка именно в этом.

Share this post


Link to post
Share on other sites

попробовал бордер поставить в 1px, все равно идет смещение...

Share this post


Link to post
Share on other sites

Или это не колдунство, а функция движка. Нет под рукой чистой сборки, да и заниматься некогда.

Нужно попробовать на стандартной теме "забить" в ширину категориями/подкатегориями меню и поглядеть, как оно формируется.

Тогда действительно не исключено, что толстенькие обводки "сбивают прицел".

upd: и категории и подкатегории?

Share this post


Link to post
Share on other sites

сейчас вообще убрал бордеры..все равно div'у присваивается какой-то непонятный

margin-left: -46px; (было -62)

Share this post


Link to post
Share on other sites

А если попробовать решение из поста #4, только заставить его быть !important ?

Интересно.

Share this post


Link to post
Share on other sites

Для крайних правых сработало. Встали на место, но теперь проблема со всеми остальными - левый края выпадающих меню, соответственно сдвинулись на эти же 5px влево..

Share this post


Link to post
Share on other sites

#menu - левый паддинг обнулить?

Но это уже явно кривень несусветный :-D

вобщем, думать нужно.

Share this post


Link to post
Share on other sites

Скорее всего у вас работает скрипт, который и назначает дивам стиль прямо в шаблоне. Я вообще не могу понять зачем там дивы в списке. На вашем месте я бы из меню убрал дивы и переверстал меню. У вас меню конечно специфическое, я бы или в php добавил id категорий или с помощью псевдоклассов выкручивается http://htmlbook.ru/css/nth-child , конечно может если подумать то и более ровное решение можно найти.

Share this post


Link to post
Share on other sites

Скорее всего у вас работает скрипт, который и назначает дивам стиль прямо в шаблоне.

как этот скрипт выявить? )

по поводу - переверстать меню - я бы с радостью, да вот пока что знаний для этого не сильно хватает ((

Share this post


Link to post
Share on other sites

как этот скрипт выявить? )

по поводу - переверстать меню - я бы с радостью, да вот пока что знаний для этого не сильно хватает ((

вот этого не скажу. Это нужно искать по шаблону. А если убрать то просто снести <div> и ему просто будет нечего двигать

Share this post


Link to post
Share on other sites
#menu > ul > li > a {
border-radius: 11px 11px 0px 0px;
color: #0C83D4;
display: block;
font-size: 14px;
font-weight: 700;
line-height: 14px;
padding: 12px 6px 11px 4px;
position: relative;
text-decoration: none;
z-index: 6;
}



#menu > ul > li ul > li > a {
color: #FFFFFF;
display: block;
min-width: 120px;
padding: 2px;
text-decoration: none;
white-space: nowrap;
}

Share this post


Link to post
Share on other sites

Нужно все бордеры сделать в одном стиле, а то у вас при li:hover бордер 2 px а в спокойном 1 px вот и косячит.

Share this post


Link to post
Share on other sites

<p>

вот этого не скажу. Это нужно искать по шаблону. А если убрать то просто снести</p>

<div>и ему просто будет нечего двигать

попробовал убрать div, все меню пошло косяками.. ((

 #menu > ul > li > a { border-radius: 11px 11px 0px 0px; color: #0C83D4; display: block; font-size: 14px; font-weight: 700; line-height: 14px; padding: 12px 6px 11px 4px; position: relative; text-decoration: none; z-index: 6; } #menu > ul > li ul > li > a { color: #FFFFFF; display: block; min-width: 120px; padding: 2px; text-decoration: none; white-space: nowrap; }

</div>

сделал ваш вариант..практически ничего не изменилось ((

Share this post


Link to post
Share on other sites

<p>

попробовал убрать div, все меню пошло косяками.. ((

</div>

сделал ваш вариант..практически ничего не изменилось ((

Конечно если убрать див то нужно ввертываться второй уровень меню. Конечно трудно придется без знания верстки магазин вести. Допишите тогда кусок в цсс:

#menu li:nth-child(7) div {
          margin-left: -65px !important;
}

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
You are posting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.