Avisos
Vaciar todo

Tema Palene: ajustes en logo  

Página 2 / 2
 
Alízaro
 Alízaro
Estimable Member

Hola:
Quiero dejar un logo que ocupe todo el ancho de la página en el tema Palene. He ido probando en el diseño hasta el ancho necesario; pero cuando lo aplico no sale centrado, lo coloque como lo coloque en cuanto a alineación.
He probado desde los 1024 hasta los 1200 px de ancho que tiene en la actualidad. El de 1024 se queda corto y los siguientes se desajustan hacia la derecha.
¿Cómo puedo solucionarlo?
Gracias y saludos.

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 31/05/2016 4:06 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Es lógico lo que comentas, pero lo que te comenté no es que apliques directamente esto :

#rt-header #rt-logo {
    margin-left: 0;
}

REvisa el código que te envie verás que esta dentro del media query es decir dentro de :
@media only screen and (max-width: 767px)

Saludos

ResponderCitar
Respondido : 15/06/2016 11:41 pm

Cursos Gratuitos WordPress

Alízaro
 Alízaro
Estimable Member

Hola:
No lo veo.
Todo el CSS personalizado que tengo metido es el siguiente:
.module-content table{
width:100%;
}
table.events-table td{
border : 2px solid white;
padding:10px;
background:#EAEAEA;
}

table.events-table tr td:first-child{
background:#D6D6D6;
}
@media only screen and (max-width: 767px) {
#rt-logo {
background: url("http://telofacilito.es/lacalle/wp-content/uploads/2013/12/lacalle_logo-movil_a275.png") no-repeat scroll center!important;
width:auto!important;
height:150px
}
}
#rt-header #rt-logo {
margin-left: 0px;
}

De esta forma, el logo de móvil queda perfectamente centrado; pero el principal se desplaza hacia la derecha.
¿Qué tengo que cambiar de ese código para que el logo principal quede centrado?

Saludos.

ResponderCitar
Respondido : 16/06/2016 1:45 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alízaro.
Deja el código del logo móvil tal cual esta sin modificar.

Modifica solo la linea del codigo perteneciente logo para PC:

#rt-header #rt-logo {
    margin-left: -15px;
}

Con esto solo modifica la versión para PC y la móvil se queda como esta.

Un saludo

ResponderCitar
Respondido : 16/06/2016 3:50 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Alízaro
 Alízaro
Estimable Member

Hola, Pepe:
Es lo que he hecho, y al darle el favor -15, el principal queda perfecto; pero el de movil queda ligeramente ladeado hacia la izquierda.

ResponderCitar
Respondido : 16/06/2016 4:00 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Siempre que trabajes con código debes ser estricto, revisa bien el código qeu te envie por que estas poniendolo de manera incorrecta.

Lo que envias es :

@media only screen and (max-width: 767px) {
	#rt-logo {
		background: url("telofacilito.es/lacalle/wp-content/uploads/2013/12/lacalle_logo-movil_a275.png") no-repeat scroll center!important;
		width:auto!important;
		height:150px
	}
}

#rt-header #rt-logo {
	margin-left: 0px;
}

Lo que te comenté que hagas es :

@media only screen and (max-width: 767px) {
	#rt-logo {
		background: url("telofacilito.es/lacalle/wp-content/uploads/2013/12/lacalle_logo-movil_a275.png") no-repeat scroll center!important;
		width:auto!important;
		height:150px
	}
	
	#rt-header #rt-logo {
		margin-left: 0px;
	}
}

Si te das cuenta #rt-header #rt-logo esta dentro del @media, el resto del código enviado por Pepe dejalo igual no modifiques el código, a pesar de ser similar este es un nuevo código.

En resumente tendrás dos sentencias : #rt-header #rt-logo una fuera del @media con -15px de margen y la otra dentro dando 0 de margen. El código completo entonce sería :

#rt-header #rt-logo {
	margin-left: -15px;
}

@media only screen and (max-width: 767px) {
	#rt-logo {
		background: url("telofacilito.es/lacalle/wp-content/uploads/2013/12/lacalle_logo-movil_a275.png") no-repeat scroll center!important;
		width:auto!important;
		height:150px
	}
	
	#rt-header #rt-logo {
		margin-left: 0px;
	}
}

Si revisas el código se aplica un margen de -15px siempre pero para una resolución de 767 o menor se aplica un margen de 0

Saludos

ResponderCitar
Respondido : 16/06/2016 7:41 pm

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

Alízaro
 Alízaro
Estimable Member

background: url("telofacilito.es/lacalle/wp-content/uploads/2013/12/lacalle_logo-movil_a275.png") no-repeat scroll center!important;

Si lo indico así, no aparece, he de poner la url entera. "http..."
Pero ahora quedan perfectos.

Gracias y saludos.

ResponderCitar
Respondido : 16/06/2016 10:06 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Si, esta vez me equivoque yo al mandar el código, por copiarlo de la respuesta de foro.
Entiendo ya solucionaste tu problema.

Saludos.

ResponderCitar
Respondido : 16/06/2016 10:10 pm

Página 2 / 2