Hola, he creado una página en mi sitio tbdo.es (la página es: tbdo.es/programacadadiaungrandia) y tengo un problema con el centrado de las imágenes. He incluido tres fotos y selecciono que las ponga centradas y otra foto más que selecciono ajustada a la derecha, y en el editor se ve todo bien pero una vez publicada la página ese formato se pierde y las imágenes aparecen todas ajustadas a la izquierda.
¿Me podríais indicar cómo puedo solucionar esto?
Gracias.
Contenido solo visible a usuarios registrados
Hola Juan,
Prueba agregar en Apariencias > Personalizar > Css adicional, este código:
.aligncenter {
margin-left: auto;
margin-right: auto;
display: block;
}
Verifica y nos comentas.
Un saludo 🖐️
@argenis Muchas gracias.
Ya he hecho lo que me dices y ha funcionado perfectamente. Lo único que en el editor el texto aparece todo debajo de la fotografía, es decir, no excede de los márgenes del tamaño de ésta; sin embargo, en la página publicada el texto va más allá de los márgenes de la foto. ¿Hay alguna manera de ajustarlo para que salga ajustado al tamaño de la foto? Cuando veo la página en el móvil se ve genial porque cada foto va de lado a lado de la pantalla y el texto está debajo ajustado al tamaño de esta. Sin embargo en cuando veo la página en un navegador web el texto ocupa toda la pantalla y la foto no. Te dejo la URL: www.tbdo.es/programaquetengasungrandia.
Muchas gracias.
Juan Manuel
Hola Juan Manuel.
La URL que indicas no carga, no se si es por qué esta como borrador.
Necesitamos que este accesible para poder revisarlo.
Un saludo
@pepesoler Hola Pepe,
He vuelto a publicar la página por si había un problema con ello. La URL es: https://tbdo.es/programacadadiaungrandia.
Gracias.
Hola Jose Manuel.
Ese es el comportamiento normal, la imagen es un poco más pequeña de la descripción del texto.
Puedes hacer que la imagen tenga el mismo tamaño que el bloque del texto añadiendo lo siguiente en apariencia -> personalizar -> CSS Adicional:
.aligncenter {
width:100%!important
}
Si lo que quieres es que la columna tenga el mismo tamaño que la imagen actual añade lo siguiente en apariencia -> personalizar -> CSS Adicional:
@media (min-width: 992px){
section.content-area.bg1 .col-md-12 {
width: 60%;
margin-left:33%;
}
}
Prueba alguna de las dos opciones y nos comentas.
Un saludo
@pepesoler Hola de nuevo Pepe.
Ya he añadido el código adicional para que la imagen tenga el tamaño actual y el texto se ajuste a su tamaño y lo hace bien pero lo que ocurre es que al acceder a la página se ve colocado en la derecha de la pantalla, queda mucho espacio a la izquierda, no está centrado.
¿Hay manera de que aparezca centrado?
Gracias.
Hola Juan Manuel.
Modifica el valor de margin-left hasta ajustarlo:
margin-left:33%;
Un Saludo
¿Dónde lo hago?
En lo último que me has dicho que hiciera ya aparece margen-left: 33%.
Donde no aparece es en lo primero que me dijisteis que introdujese (está arriba en el hilo de esta consulta; me respondió Argenis), ahí aparece margen-left: auto
Gracias.
JM
hola Juan Manuel.
En lo último que me has dicho que hiciera ya aparece margen-left: 33%.
Ese valor es el que tienes que modificar, por ejemplo puedes utilizar 25% e ir probando.
Un Saludo
Muchas gracias Pepe. Ya lo he hecho y ha quedado todo perfecto.
Una ultima pregunta: al final de la página he incluido unos videos de Youtube y aparecen ajustados a la izquierda porque no me da la opción de seleccionar el ajuste, ¿hay alguna manera de que pueda ponerlos para que aparezcan centrados?
JM
Hola Juan Manuel
Prueba con esto:
iframe {
margin-left: 10%;
}
Un Saludo
Hola Juan Manuel.
Nada, Gracias a ti.
Cualquier consulta que tengas no dudes en comunicarlo.
Un saludo