Soporte > Temas

Problema con alineación de imágenes

<< < (2/4) > >>

nv1962:
Por si acaso: si se trata de dos sistemas que se pugnan entre sí por controlar el CSS (p.ej. porque tienes un guión JS externo con su propio CSS, digamos desde Google, y otro interno de la bitácora) podrías intentar la solución ha lo vruto que es meter a capón en el CSS interno (se supone que tiene la máxima autoridad) la declaración CSS "important". P.ej., en un caso que aplica de manera forzada una alineación así sobre imágenes en un div "fotogenial" y otro div de aplicación arbitraria "alinizq" para alinear todo a la izquierda, con un margen superior e inferior de 0,5 espacios eme, quedaría así:


--- Código: ---img.fotogenial, div.alinizq {
float:left !important;
margin:0.5em 0 0.5em !important;
}

--- Fin del código ---

Es un remedio poco elegante, y de hecho contraviene la filosofía CSS, pero con varios CSS que se pelean, !important puede salvarte el pellejo. Por cierto: ojo con no dejar espacios entre "!important" y ";" que sino probablemente no te funcionará.

Angeles Portillo:
Yo lo que veo raro es que has metido las imágenes como attachement creando un div para imagen.

Teniendo los estilos de alineación creados como los tienes para imágenes y textos no entiendo porqué metes estilos en el editor de texto, veo que metes estilos de párrafo y bueno, encuentro que el código está un poco sucio, a veces hay un div para la imagen, a veces la imagen directamente....

(copio algunos trozos, no lo pongo como código para que se vean las negritas)

<p style="text-align: justify;">En este tercer y último post del especial para aprender a hacer <span class="hilite">un</span> <span class="hilite">detector</span> <span class="hilite">de</span> <span class="hilite">metales</span>, os enseñaré a <span class="hilite">hacer</span> <strong>la caja, es la parte más complicada del invento</strong> y dónde irán los componentes más importantes <span class="hilite">de</span> todo el montaje, vamos podríamos decir que <strong>es el cerebro del <span class="hilite">detector</span> <span class="hilite">de</span> <span class="hilite">metales</span></strong>.</p>

<p style="text-align: justify;">- TuperWare bonito (el mio lo escogió mi novia ¬_¬) y espacioso, para que dentro <strong>quepan todos los elementos</strong> sin problemas.</p>

<p style="text-align: justify;">-<strong> </strong>Placa <span class="hilite">de</span> circuito impreso ya montada, para esto necesitaréis <span class="hilite">un</span> boceto <span class="hilite">de</span> las pistas (ver imágen) y saber <span class="hilite">hacer</span> una placa <span class="hilite">de</span> circuito impreso, <strong>muy bien explicado <a href="http://www.comohacer-howtodo.com/electronica/como-hacer-placa-de-circuito-impreso-i/">en este otro post</a></strong>. Tened mucho cuidado con el <em>efecto espejo</em>, os debe quedar <em>comohacer-howtodo</em> legible cuando tengáis la placa terminada.</p>

<p style="text-align: justify; padding-left: 30px;">Aquí os dejo también la lista de los componentes de la placa que podréis encargar a cualquier tienda de electrónica, solo decir que compréis <span class="hilite">de</span> sobra por si jodeis alguno mientras soldáis la placa:</p>
<p style="text-align: justify; padding-left: 30px;">
</p><div style="width: 425px;" class="wp-caption aligncenter" id="attachment_405"><a href="http://www.comohacer-howtodo.com/wp-content/uploads/2008/11/placa-componentes.jpg"><img height="311" width="415" alt="Componentes en la placa" src="http://www.comohacer-howtodo.com/wp-content/uploads/2008/11/placa-componentes.jpg" title="placa-componentes" class="size-full wp-image-405"/></a><p class="wp-caption-text">Componentes en la placa</p></div>
<p style="text-align: justify; padding-left: 30px;">
</p><blockquote>
<p style="text-align: justify;">- 2 condensadores electrolíticos <span class="hilite">de</span> 220uF y 16v, tened muy en cuenta que estos hay que ponerlos bien, es decir, <strong>positivo con positivo y negativo co
n negativo</strong> (en la imágen se ve perfectamente que el negativo está para abajo). (1 en la imágen)</p>
</blockquote>
<p style="padding-left: 30px; text-align: justify;">
</p>



Te marco algunas cosas raras que veo, pero si solo abres un párrafo, metes la imagen o el div de imagen con la alineación que quieras, y lo cierras,  no necesitas darle más alineaciones al párrafo, no sé si esto lo has hecho a mano, o tal vez has usado un editor de texto que te ha creado estilos.... cuando el texto debes introducirlo en bruto, sin estilos y darle los estilos en el editor de Wp.

Está muy liado todo el HTML, incluso veo montones de comments-forms!! yo editaría el post de nuevo. Le quitaría todos los estilos creados y lo dejaría limpito con los estilos del CSS.  :-\

nv1962:
Uy uy uy... Ni me había fijado en ello. ¡Buena pieza que cazaste Ángeles!

Efectivamente: el tener elementos de presentación en el código HTML (p.ej. <p style="text-align:justify;>) es algo que debe evitarse a toda costa.

De lo contrario, te vuelves loco pescando y hurgando.

Limpia el código HTML (no será que lo pegaste desde otro programa ¿no? a veces eso también te incorpora "porquerías" de estilo - aunque confío que en este caso no se da, sobre todo lo sufre quien copie y pegue texto desde Microsoft Word) y después utiliza Firefox con el plugin Firebug para tocar el CSS hasta que esté todo acorde con tu criterio.

Alberton:
Que va hombre, es todo original escrito de mu puño y letra, esos códigos a los que os referiis, los crea el propio editor de WP con los tipicos botoncitos de arriva.

Angeles Portillo:

--- Cita de: Alberto Navarro en 26 de Febrero de 2009, 23:41 ---Que va hombre, es todo original escrito de mu puño y letra, esos códigos a los que os referiis, los crea el propio editor de WP con los tipicos botoncitos de arriva.

--- Fin de la cita ---

Pues contente un poco y no le des a tantos botoncitos, jajaja. Revisa también la plantilla.

Navegación

[0] Índice de Mensajes

[#] Página Siguiente

[*] Página Anterior

Ir a la versión completa