0

intento ocultar un span en mi codigo mediante bootstrap.

Solo quiero que se muestre en navegadores y no en dispositivos moviles

   <div class="hidden-md-down"><span id="logo-textosp">aenean luctus</span></div>

Pero no me funciona

¿alguna idea?

4
  • 4
    Pregunto lo obvio primero para descartar. Estás usando bootstrap 4 u otra versión anterior?
    – Eztronics
    Commented el 16 may. 2018 a las 12:00
  • 2
    ¿Que version estas usando de bootstrap?, ya que en la 4 cambia completamente la forma de ocultar los elementos Commented el 16 may. 2018 a las 12:13
  • Podrías mostrar el archivo completo en donde tienes el div de la descripción de tu problema? por favor. Me gustaría descartar que sea un problema de carga del framework como tal en el archivo.
    – Eztronics
    Commented el 16 may. 2018 a las 12:17
  • 1
    otra pregunta seria en que movil lo estas mirando? ten en cuenta que bootstrap se basa en el tamaño de la pantalla. Si tienes un movil de resolucion 1920x1080 (que los hay) es posible que te lo muestre (porque para bootstrap no seria un movil)
    – Jakala
    Commented el 16 may. 2018 a las 12:22

2 respuestas 2

1

Prueba con class="d-md-none d-block"que es el equivalente a la clase que quieres utilizar pero la ultima version de bootstrap. Puedes leer más información y los últimos cambios en la versón 4 beta

1
  • Si,tenia que utilizar la actualización de bootstrap 4. ¡Muchas gracias! Commented el 16 may. 2018 a las 21:05
0

Lo podrías realizar con CSS y query media para diseños responsivos es cierto que todo depende de la resolución como te han comentado, pero básicamente con este @media cuando el ancho de la pantalla llega a 480px (puede ser la resolución que gustes o incluso incluir más con distintas resoluciones) a la clase .hidden-md-down se le garega el estilo display:none; para que no lo muestre. Para ver el resultado prueba el ejemplo en pantalla completa o ampliar.

.hidden-md-down{
height:150px;
width:100%;
display:block;
background-color:blue;
color:#fff;
}

@media (max-width:480px){
.hidden-md-down{ display:none; }
}
<div class="hidden-md-down"><span id="logo-textosp">aenean luctus</span></div>

Quizá no es la solución más elegante o adecuada pero en ciertos casos funciona. Saludos.

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.