Reducir cabecera y ...
Avisos
Vaciar todo

Reducir cabecera y menu responsive en el movil  

 
Enrique
 Enrique
Famed Member

Buenas tardes,

Estoy usando la plantilla ja-onepage con joomla 3. Tiene la cabecera fija y necesita reducirla en la vista de móviles ya que un móvil se ve mucha cabecera y poco contenido de la web.

También me gustaría simplificar el margin-top y margin-bottom del botón responsive del menú, quedando lo más ajustado posible arriba y abajo.

Adjunto imagen.

He creado un archivo con el nombre de la plantilla-custom.css y he agregado los estilos para @media (max-width: 767px) pero no los reconoce y lo he borrado.
En las plantillas Gantry funciona así no?

Gracias.

Espero vuestras noticias.

Un saludo, Enrique P.

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 14/10/2015 2:19 pm
Pablo Velasco
 Pablo Velasco
Illustrious Member

Hola,

Prueba a añadir un código CSS como el siguiente:

@media (max-width: 767px) {
  #ja-header .logo-image {
    margin-bottom: 0;
    padding-bottom: 10px;
  }
}

@media (max-width: 1024px) {
  .t3-mainnav .navbar .btn-navbar {
    margin: 0 0 0 20px;
  }
}

.t3-mainnav .navbar-inner {
  min-height: 20px;
}

Lo puedes añadir en el archivo templates/ja_onepage/css/custom.css.

ResponderCitar
Respondido : 14/10/2015 3:13 pm

Enrique
 Enrique
Famed Member

Buenas tardes,

En el navegador del móvil sigue sin salir bien.

Un ejemplo, es mi móvil, samsung galaxy s5.

Espero tus noticias.

Gracias.

Un saludo, Enrique P.

ResponderCitar
Respondido : 14/10/2015 4:49 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

En firefox lo veo bien, salvo por el catalogo que genera un scroll horizontal.

En el emulador lo visualizo igual
http://www.viewportemulator.com/devices/samsung/galaxy-s5-sm-g900f/?url=http%3A%2F%2Fwww.informaticapavon.net%2Fdesarrollo%2Fmonta2%2F

Saludos.

ResponderCitar
Respondido : 14/10/2015 7:22 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Enrique
 Enrique
Famed Member

Buenos días,

He añadido este código:

@media (max-width: 767px) { .logo h1, .logo h1 a {
margin-top: 0px; }

para reducir aún más la cabecera, ¿es correcto?

De momento no lo está reconociendo.

Espero noticias.

Gracias.

Un saludo, Enrique P.

ResponderCitar
Respondido : 15/10/2015 10:09 am
Julen
 Julen
Miembro Admin

Hola,

El código que nos indicas es correcto, no obstante para que los cambios se apliquen ponlo de la siguiente forma:


@media (max-width: 767px) { .logo h1, .logo h1 a {
margin-top: 0px  !important; }

Saludos

ResponderCitar
Respondido : 15/10/2015 10:57 am

wpdoctor-revisa-la-salud-de-tu-wordpress