Avisos
Vaciar todo

Problema con el centraje de imagenes en widget HTML  

Página 2 / 3
 
Javier
 Javier
Estimable Member

Hola,
Quiero añadir una sección en el main bottom donde se muestren los partners del blog.
El problema es que al añadir los dos logos no tengo manera de que me salgan en linea y centrados.

El resultado que veis es el producido al añadir las dos fotos con codigo html y después decirle a la primera imagen que se posicione a la izquierda y a la otra que lo haga a la derecha, y el resultado es que me las separa mucho y la primera esta ubicada una linea mas arriba que la otra.
¿Alguna forma de hacer que salgan en linea, misma altura y centrados sin tanta separación?
Gracias

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 25/07/2017 5:40 pm
Javier
 Javier
Estimable Member

Hola,
Ya he insertado en el widget el código de mas arriba:

La foto de la izquierda tiene las siguientes dimensiones: 365*90
La foto de la derecha tiene las siguientes dimensiones: 232*90
Este es el resultado con el código anterior y las dimensiones de imagenes citadas:
No consigo igualarlas en tamaño con ningún programa, tan solo puedo igualar la altura.

 

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 09/08/2017 11:53 am

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

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Javier.

Si reviso el código veo que tienes un salto de linea:

 

Tienes que eliminar la etiqueta
para que se muestre bien.

 

Un saludo

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 09/08/2017 12:29 pm
Javier
 Javier
Estimable Member

Hola Pepe,
Gracias por la respuesta tan rápida.
No acabo de ver donde tengo la etiqueta
en el código insertado en el widget HTML.
¿Me podrías especificar por favor como verla para poder eliminarla?
Gracias

ResponderCitar
Respondido : 09/08/2017 12:34 pm

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

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Javier.

Ok modifica el bloque de la segunda imagen por este:

Como veras añadí un margin para que se alinee con la primera imagen.

Un saludo

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 09/08/2017 1:51 pm
Javier
 Javier
Estimable Member

Hola Pepe,
Cambiándolo con el código que me escribes el resultado es el siguiente:

A parte de que me gustaria que la imagen de la derecha quedara por debajo de la barra gris de partners, necesitaria que las dos imagenes quedaran centradas una al lado de la otra.
Gracias

ResponderCitar
Respondido : 09/08/2017 2:03 pm

Cursos Gratuitos WordPress

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Javier.

baja un poco el valor de margin-top:-10px;, puedes variar ese valor hasta que se muestre en la posición que quieres.

Un saludo

ResponderCitar
Respondido : 09/08/2017 2:25 pm
Javier
 Javier
Estimable Member

Perfecto Pepe.

Ya solo me faltaria poder centrar las dos imagenes y si es posible hacer que la imagen de la izquierda sea mas pequeña (de medidas similares a la de la derecha) mediante código en el mismo widget.

Gracias

ResponderCitar
Respondido : 09/08/2017 2:34 pm

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

Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

La imagen grande tiene 350px de ancho y la otra 232px, creo que lo mejor sería que subas las imágenes con el tamaño correcto.

Si quieres forzar el tamaño por CSS, podrías colocar un código que haga referencia a la primera imagen, pero el problema es que no hay una clase o id que lo identifique por eso te comenté que lo más práctico es que uses el tamaño correcto desde el inicio cuando subes el archivo de imagen.

Saludos.

ResponderCitar
Respondido : 09/08/2017 7:10 pm
Javier
 Javier
Estimable Member

Arreglado. Ahora tan solo quisiera que las dos imagenes estuvieran en el centro en vez de pegadas a la izquierda.
Gracias

ResponderCitar
Respondido : 09/08/2017 7:35 pm

Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Entiendo que estas usando un widget de texto para insertar las imágenes por html, simplemente usa las opciones del editor del widget para centarlas, asi como centras un texto puedes centras las imágenes.

Saludos.

ResponderCitar
Respondido : 09/08/2017 10:43 pm
Javier
 Javier
Estimable Member

Hola,
Los he centrado y aun así se quedan en la derecha. He probado de limpiar el cache de navegador y nada..
el codigo es el siguiente:

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 09/08/2017 11:08 pm

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

Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Tu código es incorrecto, incluye un float, esto nunca permitirá centrase, usa simplemente el siguiente código;

 

Saludos.

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 09/08/2017 11:26 pm
Javier
 Javier
Estimable Member

Hola,
Al final he optado por insertar el siguiente código:

El resultado es que me los centra pero uno encima del otro

 

Mi idea sigue siendo que estén centrados pero uno al lado del otro y a la misma altura. Hasta ahora las pruebas que he ido haciendo con el codigo de las respuesta de este hilo, juntaban las imagenes pero me la desplazaban a la izquierda, y en la versión movil se veian muy mal.
¿Alguna idea para conseguir juntarlas una al lado de la otra, centrarlas, y que se vean en el movil correctamente?
Gracias

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 12/08/2017 3:22 am

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

Luis Mendez Alejo
 Luis Mendez Alejo
Miembro Moderator

Hola Javier,

¿Puedes pegarnos aquí el código exacto "actual" que has insertado en el widget "HTML personalizado" para revisarlo?

Has hecho muchos cambios y ya no es fácil seguir el hilo para entender en que fase de cambios se han quedado los banners.

¿Has probado los cambios que te sugerí en otro hilo del Foro para el banner gif del footer, en estos banners?

Contenido solo visible a usuarios registrados

Saludos

ResponderCitar
Respondido : 13/08/2017 4:16 am
Javier
 Javier
Estimable Member

Hola,
si es cierto que probé muchas cosas pero al final los deshice porque en la versión móvil se veían fuera de la pantalla.
el código que deje y que da el resultado que se ve en la imagen de mi ultimo mensaje de este hilo es el siguiente:

No he probado de poner codigo similar al del banner superior a partners ya que como son 2 imagenes no pensé que se pudiera hacer.
gracias

Esta publicación ha sido modificada el hace 4 años por antonio
ResponderCitar
Respondido : 13/08/2017 4:39 pm

Cursos Gratuitos WordPress

Página 2 / 3