Open dropdown over the div

Asked

Viewed 1,069 times

2

Hello, I have a dropdown made with ui-select, which does not open above the rest of the site.

inserir a descrição da imagem aqui

as you can see it opens only up to the limit of the div inserir a descrição da imagem aqui

I’ve tried the examples I found on websites. examples: position: Absolute, z-index: 99999, overflow: Visible, in not one case did I succeed.

Ui-select code:

<div class="form-group">
 <strong>Perfis: </strong>
 <ui-select ng-model="acao.perfis"
            multiple
            title="Selecione um perfil">
  <ui-select-match placeholder="Perfil" allow-clear="true">{{$item.nome}}      </ui-select-match>
  <ui-select-choices  repeat="perfil in acoesCtrl.perfis | filter: $select.search">
      {{perfil.nome}}
  </ui-select-choices>
  <ui-select-no-choice>
     Nenhum registro encontrado
  </ui-select-no-choice>
  </ui-select>

My question is: How to open the dropdown on the div?

html css front-end

  • What is the OVERFLOW of this div.col-Md-6?

  • div has the col-Md-6 bootstrap class, which as far as I know has no overflow and the class: gc-panel . gc-panel { padding-top: 9px; padding-bottom: 9px; }

  • inspects the element and finds out which last OVERFLOW applied to it, because the attribute that prevents an element from stretching, or passing, the height is the overflow

  • the element has only the overflow: overflow-x: Hidden; that when removing it, just removes the scroll from the drop down. adding another kind of overflow, has no effect whatsoever.

1 answer

-1

Here is a suggestion

Have you tried using css in the parent and child container:

.elemento-pai{
    position: relative
}

.elemento-filho{
    position: absolute;
    z-index: 1;

}

Browser other questions tagged html css front-end

You are not signed in. Login or sign up in order to post.