Es exactamente como dice
victorhugoa, pero una forma más sencilla de hacerlo sin tanto código y que debería de funcionarte es lográndolo mediante los css. Yo creo dos estilos (normalmente no uso las imágenes abajo de los texto sino a ambos lados) y los agrego al archivo
template.css o al que quieras:
Código:
img.left {
float: left;
margin-right: 10px;
border: 1px solid #CCC;
padding: 2px;
}
img.right {
float: right;
margin-left: 10px;
border: 1px solid #CCC;
padding: 2px;
}
Con ese código simplemente en donde inserté la imagen le agrego la clase
left ó
right, dependiendo del caso y quedaría algo así:
Código HTML:
<p><img src="images/stories/imagen1.jpg" title="titulo imagen" alt="titulo imagen" class="left" />Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore</p>
Cabe señalar que ciertos editores no atribuyen automáticamente las dimensiones de las imágenes y si trabajas con formatos
.jpg, .gif no habrá problemas, pero si usas
.png entonces el
IE6 no las redimensionará dejándolas defectuosas y en este caso sí podrías usar las etiquetas
width y
height en tus artículos.
Código HTML:
<p><img src="images/stories/imagen1.jpg" title="titulo imagen" alt="titulo imagen" class="left" width="250px" height="100px" />Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore</p>