Skip to main content

Respuestas populares con la etiqueta

20 votos
Aceptado

Generar un grid con un div que ocupe más de una fila en Bootstrap 4

Antes que nada, quiero aclarar que no conozco Angular, y asumo por lo que dice el OP que la estructura del HTML generado no se puede modificar por algún motivo. El problema en este caso y por el cual ...
Avatar del usuario Shaz
  • 29.2k
14 votos
Aceptado

Hacer que el dropdown se despliegue al pasar el mouse (HOVER)

Si usas jquery puedes utilizar el método .hover() y agregarle la funcion trigger para lanzar el método onclick $('#dmenu').hover(function(){ $('#navbarDropdown').trigger('click') //console....
Avatar del usuario Killbunny
  • 1,463
9 votos

Generar un grid con un div que ocupe más de una fila en Bootstrap 4

Bootstrap trabaja con primero filas luego columnas: Por la tanto primero creamos una fila que contendrá 2 columnas: Dentro de la primera columna insertamos un div vacío, luego en la siguiente columna ...
Avatar del usuario Willian Rivera
8 votos
Aceptado

Eliminar estilo a botón Bootstrap

El problema que tienes es que ese borde es el "foco" del botón. Es decir, marca que el botón tiene el foco activo tras haberlo pulsado. Puedes quitar el foco mediante javascript o bien eliminar ese ...
Avatar del usuario OscarGarcia
  • 28.5k
8 votos
Aceptado

¿Cómo puedo colocar texto encima de una imagen responsiva?

El truco es ponerle una posición relativa al padre y una absoluta al nombre. De ese modo se colocará de manera absoluta con respecto al padre. #content_div_one_photo { height: 16rem; width: ...
Avatar del usuario Alvaro Montoro
  • 49.8k
8 votos
Aceptado

¿Cómo anular la mutua exclusividad de un acordeón en Bootstrap 4?

Si solo tienes un acordeón por página, la solución más sencilla es quitar el atributo data-parent: <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-...
Avatar del usuario Shaz
  • 29.2k
8 votos

Alinear dentro de nav Bootstrap 4

Para alinear elementos a la derecha dentro de un navbar, Bootstrap cuenta con la clase .ml-auto que se aplica a las listas <ul>, esto es posible si se usa Flexbox. Lo que hace esta clase es "...
Avatar del usuario Jheyman Mejia
8 votos

Como puedo mostrar en un modal, los detalles de un pin de un mapa de Leaflet

Vamos por partes, primero la lógica del modal viene de: Seleccionas un marker en el mapa. Aparece un popup pequeño con un botón de ver detalles. Si le das click en el botón de ver detalles, te debe ...
Avatar del usuario fredyfx
  • 13.2k
7 votos
Aceptado

Bootstrap 4 - Checkbox al pulsar uno se pulsa el otro

primero que nada, te recomiendo que leas la documentación de bootstrap que es simplemente espectacular, con pegarle una leida evitarás este tipo de problemas! En tu código tenes 3 problemas. Los ID ...
Avatar del usuario Juan Salvador Portugal
7 votos
Aceptado

Alinear dentro de nav Bootstrap 4

Esta nav va a tener algo más que el botón, como por ejemplo una lista de items? Porque si solo vas a poner el botón creo que es mejor hacerlo en un div y no en una nav. <link href="https://...
Avatar del usuario kifka81
  • 84
7 votos
Aceptado

Fallo Css datetimepicker de bootstrap

Ya te estuve ayudando con eso el otro día. Tienes que cargar las librerías correctas. Estás tratando de usar dos librerías diferentes. Por un lado datepicker, que pertenece a JQueryUI y cuya librería ...
Avatar del usuario phpMyGuel
  • 14.8k
6 votos
Aceptado

Problema con Container-fluid con imagenes

La clase container-fluid como tal no incluye márgenes pero sí incluye padding: .container-fluid { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-...
Avatar del usuario Shaz
  • 29.2k
6 votos
Aceptado

Dejar marcada la página del menú en la que te encuentras bootstrap 4

Para que los li en Bootstrap 4 se queden marcados hay que agregar la clase active, lo puedes hacer en Javascript. Primero agregarle un id a los li <li class="nav-item" id="tab-index"> <...
Avatar del usuario Emiliano Montesdeoca
6 votos
Aceptado

¿Mostrar un modal de bootstrap en Angular?

Después de analizar un poco más la documentación de Angular y TS descubrí mi error mensajeInicial: IMensajeInicial; @ViewChild("#modalMensaje") modal: ElementRef; el #sale sobrando una vieja ...
Avatar del usuario Misael Landeros
6 votos

Problemas en boton de paginación en Laravel 8 con CoreUI

Es debido a que Laravel usa la paginación Tailwind para cambiar esto dirígete a: App\Providers\AppServiceProvider Y agrega el siguiente USE use Illuminate\Pagination\Paginator; Y dentro de la parte ...
Avatar del usuario Ricardo M
5 votos
Aceptado

problema con el efecto hover con imagenes en bootstrap 4

Tu único error era tu selector, estabas seleccionando .portafolio .galeria .contendor-imagen:hover img {} Cuando realmente debería ser: .portafolio .galeria .contenedor-imagen:hover img{} ...
Avatar del usuario Bender Paisa
  • 12.5k
5 votos
Aceptado

cambiar color de placeholder="Segundo Nombre"

Puedes darle estilo al seudoelemento placeholder. #input_id::placeholder { color:white; } Pero esa especificación no es estándar y sólo funcionará en navegadores recientes. (Chrome 57+, Firefox ...
Avatar del usuario ffflabs
  • 23k
5 votos
Aceptado

Glyphicon con Bootstrap 4

Glyphicon dejó de estar disponible para Bootstrap4. Puede usar tanto Font Awesome como Github Octicons como una alternativa gratuita para Glyphicons. En la documentación oficial de Bootstrap4 Icons ...
Avatar del usuario Cesar Romero
  • 2,040
5 votos
Aceptado

¿Poner texto del carousel bootstrap arriba?

Si te fijas en el <div> que contiene el texto, este, además de tener un position: absolute tiene un bottom: 20px. Estas reglas en conjunto provocan que el texto esté a 20px de la parte de abajo ...
Avatar del usuario phpMyGuel
  • 14.8k
5 votos

¿Cómo centrar una tabla, usando Bootstrap y CSS?

Hice una prueba con el código que publicaste y no se muestra así. Se muestra centrado pero un poco hacia la izquierda, lo que corregí quitando esto del css: table{ position:relative; margin:...
Avatar del usuario Johan Donado B.
5 votos

¿Cómo centrar una tabla, usando Bootstrap y CSS?

La tabla se está corriendo hacia la derecha de la página porque estás asignando un ancho fijo a la sección que contiene tu tabla: section { position: relative; margin: auto; width:400px; ...
Avatar del usuario Jheyman Mejia
5 votos
Aceptado

Cómo poner un primer elemento por encima del segundo en mi código html

Para cambiar el orden de los elementos se usa z-index. El valor debe ser auto o un número entero. Un elemento con mayor valor cubre a otro con menor valor así que debes especificar un número mayor que ...
Avatar del usuario devconcept
  • 12.8k
5 votos
Aceptado

Centrar div verticalmente en pagina vacía

Puedes utilizar las clases que dispone bootstrap sobre flex. La clase d-flex equivale a display: flex en css, para centrar los elementos hijos en el eje vertical se utiliza la clase align-items-center ...
Avatar del usuario Ricardo Campos Villarroel
4 votos
Aceptado

¿Círculo responsive y con el texto en el medio en bootstrap 4?

Para centrar el contenido en tu círculo puedes utilizar flex. #circulo { width: 10rem; height: 10rem; border-radius: 50%; background: red; display: flex; justify-content: center; ...
Avatar del usuario dddenis
  • 3,983
4 votos

Ocultar en bootstrap 4

Las clases hidden-* fueron eliminadas en la version 4 de bootstrap, ahora tienes que utilizar "d-none d-lg-block" para ocultar en todos los tamaños menos en el largo.
Avatar del usuario Richard Tovar
4 votos
Aceptado

¿Como hago para que mi menú en Bootstrap 4 se desplace con la pagina, que quede fijo en la parte superior?

Debes agregar un position: fixed a tu nabvar, de esta manera: /*MENU*/ .topnav { background-color: #E4276B; overflow: hidden; /*aqui esta el cambio*/ position: fixed; ...
Avatar del usuario Aníbal Jorquera
4 votos
Aceptado

carga de iconos font awesome

Juan, debes tener un problema sea con el archivo de fontawesome que estás usando, sea con restricciones del navegador, o con las rutas u otra cosa. De todos modos en la página de FA, ellos dan una ...
Avatar del usuario A. Cedano
  • 95.2k

Only top scored, non community-wiki answers of a minimum length are eligible