1

Les pido ayuda porfa. Tengo un DIV con 3 botones y el último debe desplegar una lista, pero la lista aparece al principio de la página y no bajo el botón... Este es el código:

<div class="contenedor_botones">
     <div class="row col-md-12 col-sm-12 col-lg-12 col-xl-12  container">
        <button type="Button" style="margin-left:25px; margin-top:13px;" class="b1 col-sm-3 col-md-3 col-lg-3 col-xl-3" data-toggle="collapse" data-target="#t1,#t2,#t3,#f1,#f2,#fil1,#fil2">DESAGREGAR CIFRAS</button>
                <button type="Button" style="margin-left:25px; margin-top:13px;" class="b2 col-sm-3 col-md-3 col-lg-3 col-xl-3" id="ocultar">OCULTAR / MOSTRAR  <span class="glyphicon glyphicon-eye-open"></span> </button>
                  <div class="btn-group">
                    <button type="Button" style="margin-left:25px; margin-top:13px;" class="b3 col-sm-3 col-md-3 col-lg-3 col-xl-3" data-toggle="dropdown" >DESCARGAR</button>
                           <ul style="margin-left:25px;width:300px;" class="dropdown-menu" role="menu">
                                  <li><a href="#">Informe 1</a></li>
                                  <li><a href="#">Informe 2</a></li>
                                  <li><a href="#">Informe 3</a></li>
                                  <li><a href="#">Informe 4</a></li>
                           </ul>
 
                  </div> 
     </div>
  </div>
4
  • Hola, bienvenido. Cual version de bootstrap esta utilizando?
    – Lilibeth
    Commented el 2 sept. 2021 a las 16:42
  • lo que usted quiere hacer es que al seleccionar el button con la clase b3 esta le muestre las 3 opciones que ha colocado en su <ul>?
    – Lilibeth
    Commented el 2 sept. 2021 a las 16:45
  • Hola, v3.4.1 Gracias Commented el 2 sept. 2021 a las 16:45
  • Efectivamente. Al presionar el b3 se despligue el menù, pero debajo el mismo boton... actualmente se despliega en otro lugar de la pàgina. Commented el 2 sept. 2021 a las 16:46

1 respuesta 1

0

Esto resuelve tu problema que "se desplieguen las opciones debajo del button". Solo tendrias que revisar el style de tus botones porque añadiendo los nuevos div, cambiaron sus estilos.

  <div class="contenedor_botones">
    <div class="row">
      <div class="col-md-12 col-sm-12 col-lg-12 col-xl-12 ">
        <div class=" col-sm-3 col-md-3 col-lg-3 col-xl-3">
          <button type="Button" style="margin-left:25px; margin-top:13px;" class="b1 " data-toggle="collapse" data-target="#t1,#t2,#t3,#f1,#f2,#fil1,#fil2">DESAGREGAR CIFRAS</button>
        </div>
        <div class="col-sm-3 col-md-3 col-lg-3 col-xl-3"> 
          <button type="Button" style="margin-left:25px; margin-top:13px;" class="b2 " id="ocultar">OCULTAR / MOSTRAR  <span class="glyphicon glyphicon-eye-open"></span> </button>

        </div>
        <div class="dropdown col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <button type="Button" style="margin-left:25px; margin-top:13px;" class="b3 " data-toggle="dropdown" >DESCARGAR</button>
              <ul style="margin-left:25px;width:300px;" class="dropdown-menu" role="menu">
                  <li><a href="#">Informe 1</a></li>
                  <li><a href="#">Informe 2</a></li>
                  <li><a href="#">Informe 3</a></li>
                  <li><a href="#">Informe 4</a></li>
              </ul>
        </div> 
      </div>
    </div>
  </div>
2
  • 1
    Lilibeth, funcionò perfecto. Debo modificar el estilo, pero nada mas. Commented el 2 sept. 2021 a las 17:33
  • Chevere, selecciona que tu pregunta se ha resuelto para cerrar tu pregunta exitosamente y valorarla. :)
    – Lilibeth
    Commented el 2 sept. 2021 a las 17:35

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.