There is something wrong in the css. I don’t know if you have any expierience in css, but you have to add a float to the image.
An example of this would be:
img {
align:left;
}
But this will aply on every image on your side so use a class.
If you have no css knowledge at all it would be pretty difficult.
Hope this can help you.
Greetz,
Durgé
Dimics.com
often the style.css contains floats for image alignment; for instance the default theme:
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
these styles may be missing from your theme – if so, just add them.
Thanks for the replies!
alchymyth thanks for putting me on the right path. I got ythe below from the css file for the default template and it sorted the problem. Many Thanks!
/* Begin Images */
p img {
padding: 0;
max-width: 100%;
border: 0;
}
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
/* End Images */
Does it matter where in the CSS theme you add the code for image floats?
It has to be contained in the same element but it does not matter what order they are in.
And by same element, you mean with the other code relating to image floats?
to float the image it would have to be in the .css element for that image. so say if you are using <img src=”blah.gif” class=”alignleft”> the float would have to be in the css matching the class listed to that image. Other than that you can have that block of code anywhere in your css, although it helps to keep them grouped together.
it would look something like this
.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
float: right;
}
Is this the “same element”? I’m using cutline:
.entry img.left { padding: 3px; margin: 0.5em 15px 0.5em 0; border: 3px double #bbb; float: left; clear: left; }
.entry img.right { padding: 3px; margin: 0.5em 0 0.5em 15px; border: 3px double #bbb; float: right; clear: right; }
.entry img.center { display: block; padding: 3px; margin: 0 auto 1.5em auto; border: 3px double #bbb; float: none; clear: both; }
.entry img.off { padding: 0 !important; border: none !important; }
.entry img.stack { clear: none !important; }
we posted at the same time, read my last post.
Yes, thank you, I did read your post.
I can tell you’ve kindly given me some code to post.
I understand I can paste it anywhere on the CSS style sheet, but it is best pasted in the css element for that image. Unfortunately I do not know what that means.
It sounds like I need to search the code on the css style sheet and look for something that says “same element” or “element” or “image”.
I did find a string of code that says img. That is what I posted last.
I’m assuming that the code I posted is not the “same element.”
I will just past your code at the end of the style sheet and see what happens.
Sorry to be asking questions. Have a good night.
I added the code to the end of the CSS style sheet, but the text is still flush against the image. Does WP have a clear explanation for how to wrap text around images without the text bumping up against the image?
It has nothing to do with wordpress really. Just html and css in general. if you link me to the website i can look at the css and code and go from there.
If you are adding the code at the end of the css and there is already an element with the same name in the css it will not work
are you manually inserting the images (via code) or are you using the wp button to do it?
