Раскрывающийся список исчезает с экрана - PullRequest
Новая
       8

Раскрывающийся список исчезает с экрана

0 голосов

Я пытался многое исправить, но безрезультатно

enter image description here

enter image description here

Раскрывающийся список, плавающий влево и выходящий за пределы экрана, если я изменил значение с плавающей точкой вправо, другой раскрывающийся список выходит за пределы экрана с другой стороны.

Мой код: 

<div class="dropdown center-block">
  <a href="#" class="classiera-category-new-v2-box" data-toggle="dropdown" role="button" aria-haspopup="true"
    aria-expanded="false">
    <span class="classiera-category-new-v2-box-img">
      <i style="color:<?php echo esc_html($iconColor); ?>;" class="<?php echo esc_html($category_icon); ?>"></i>
    </span>
    <h5 class="classiera-category-new-v2-box-title">
      <?php echo esc_html(get_cat_name( $catName )); ?>
    </h5>
  </a>
  <ul class="dropdown-menu" style="border-top:2px solid <?php echo esc_html($iconColor); ?>;">
    ?>
    <li>
      <a href="<?php echo esc_url($childcategoryLink); ?>">
        <?php 
                                                if($classieraIconsStyle == 'icon'){
                                                    ?>
        <i class="<?php echo esc_html($category_icon); ?>"></i>
      </a>
    </li>
    <?php } ?>
    <li class="text-center btn btn-default btn-xs btn-block"><a
        href="<?php echo esc_url($categoryLink); ?>"><?php esc_html_e( 'View all subcategories', 'classiera' ); ?></a>
    </li>
  </ul>
  <?php } ?>
</div>

это мое css для выпадающего меню, все, что мне нужно, это продолжать плавать раскрывающийся список влево, а когда ни одно место на экране просто не поворачивается вправо, 

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: @zindex-dropdown;
  display: none; // none by default, but block on "open" of the menu
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0; // override default ul
  list-style: none;
  font-size: @font-size-base;
  text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
  background-color: @dropdown-bg;
  border: 1px solid @dropdown-fallback-border; // IE8 fallback
  border: 1px solid @dropdown-border;
  border-radius: @border-radius-base;
  .box-shadow(0 6px 12px rgba(0,0,0,.175));
  background-clip: padding-box;

  // Aligns the dropdown menu to right
  //
  // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
  &.pull-right {
    right: 0;
    left: auto;
  }

  // Dividers (basically an hr) within the dropdown
  .divider {
    .nav-divider(@dropdown-divider-bg);
  }

  // Links within the dropdown menu
  > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: @line-height-base;
    color: @dropdown-link-color;
    white-space: nowrap; // prevent links from randomly breaking onto new lines
  }
}
...