No puedo hacer que el diseño con capacidad de arranque funcione con dotnetnuke

He usado twitter bootstrap en mi proyecto con DotNetNuke. Hice mi diseño y diseño usando HTML, CSS, bootstrap. El diseño receptivo funcionaba bien cuando lo probé en diferentes dispositivos móviles e incluso cuando cambié el tamaño de la ventana de mi navegador.No puedo hacer que el diseño con capacidad de arranque funcione con dotnetnuke

Como estaba funcionando bien, convertí el diseño a DotNetNuke Skin. Ahora, el diseño receptivo funciona bien solo cuando cambio el tamaño de la ventana del navegador y no en los dispositivos móviles. Entiendo el flujo en el que DNN carga las hojas de estilo y yo lo he seguido. He hecho mi skin.css como una combinación de bootstrap.css y seguido por el contenido de bootstrap-responsive.css

No puedo encontrar el problema como si utilizo el mismo skin.css con mi html, funciona bien, pero no funciona con DNN (en dispositivos móviles).

Fuente

2012-05-22 Siddharth Pandey

Te estás perdiendo la meta que se dirige a los dispositivos móviles para una escala adecuada. Inserte lo siguiente en el encabezado de su página:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Fuente

2012-05-22 11:12:42

Hey Andres, tienes razón, olvidé incluir eso en default.aspx. –

¡Me sale la barra de desplazamiento horizontal! ¿Cómo puedo eliminar eso? –

@SidP no tiene un dispositivo móvil a mano para probar, pero uno de sus elementos probablemente está desbordando su contenedor principal. Una solución rápida sería agregar 'body {overflow-x: hidden; } 'en su hoja de estilo para ocultar esa barra de desplazamiento horizontal, pero una solución más adecuada sería buscar ese elemento que se está desbordando. –

Me acabo de dar cuenta de algo interesante y quiero compartirlo, tal vez ayudará a alguien. En la sección del encabezado del sitio debe incluir primero el archivo bootstrap.css y solo después el archivo bootstrap-responsive.css porque obviamente el responsive.css depende del bootstrap.css

Por supuesto, la etiqueta meta también debe estar presente.

<link href="/css/bootstrap.css" rel="stylesheet" type="text/css" /> 
<link href="/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" /> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Fuente

2012-09-30 19:06:34

Asegúrese CSS sensible (responsive.css) se incluye después básica no antes.

Fuente

2012-11-22 12:55:38

meltov: Por favor, ¿puede decirme qué significaba "después de lo básico no antes" – Nadeem

@Nadeem primer lugar, enlace a la hoja de estilo básica 'bootstrap.css' y luego responsive' bootstrap-responsive.css'. –

gracias hermano, solo confundo en "antes y después" – Nadeem

No puedo hacer que el diseño con capacidad de arranque funcione con dotnetnuke

Respuesta

Cuestiones relacionadas