CSS img align in IE

Can anybody tell me how to workaround the problem where if i align images right they don't show up in IE?

Thanks.

Well without displaying any of the code that you are using and are having problems with, or even better yet, showing us a sample page so that we can examine your source code to find out what you are doing wrong, I can only speculate here. Are you aligning in relation to text? Are you using the text-align property in a surrounding block element? Are you using the float property or vertical-align property with the image itself?

This is code for an image to be floated to the right in relation to the surrounding text...


You can also align images by including them in a block that has its contents aligned to the left or right margin. This is useful if you don't want other elements to flow around the image. You do this by applying the alignment style to the containing element. To align the contents of block elements you can use text-align, with a value of left, right, or center.

This code will right-align the image (and the text)...



Everything I posted above should display properly in all browsers, including IE, so again, without seeing a sample page or the source code you are using and are having problems with, I can offer no more help than I already have in this post for you.

Your two code samples still resulted in the same problem :-\

Using any form of align="right" or style="float: right;" or any other forms of picture alignment result in the picture showing up as a big white space in IE. The picture is there (hovering produces ALT text), right clicking and you can save it, and the space is taken up with blank space equivalent to the picture, but you can't see the picture.

Pictures not aligned in any way show up just fine. An example of a picture not showing up would be to view http://engr.georgefox.edu/new in internet explorer.

edit: I got the picture to show up by adding:

img{position:relative;}

to my CSS layout file. Is this a proper workaround?

Good morning. Off to work in a bit but will respond first.


Shouldn't have. Not at all.


Works fine for me in IE 6. What version of IE are you using?

Here's what I did to just test the page located at http://engr.georgefox.edu/new/index.php ...

I saved the page locally. I saved your layout.css file locally.

I removed this css code from layout.css ...
img
{
position:relative;
}

I tested the page in IE, Opera, Netscape and Mozilla Firefox browsers and your oscope.jpg image displayed just fine in every one. Therefore relative positioning didn't need to be added at all.

I don't know what to tell you other than to have someone else test it in IE to see if they experience the problem you are having. I most certainly am not experiencing any problems at all.

Also, this may be solely due to a cache problem. Completely empty your internet cache in IE and also make certain that you delete all offline content as well...

IE > Tools > Internet Options > Temporary Internet files > Delete Files >
Check mark "Delete all offline content" > press OK

That's odd. I've tested it on over 10 different machines in different locations. It works in every browser EXCEPT internet explorer.

Oh well.

There must be something else in your page causing the image to not be visible. This is not an IE thing(not a bug thing, anyway). I would imagine it's a CSS interpretation problem. Can you post the page itself somewhere for us to look at?

dM...Not sure if he got it working or not, but there is the link and his possible solution.

hi guys,

did u found any fix for this problem?

I'm strugling with this problem to. img without any align property is working well. With, in IE6 I got only the blank white space where the image should have been displayed.

please provide a link for the fix.

thanks

With regard to IE6, try this:

http://206.251.36.107/IE6.htm

For everything else, just post the code you are using and someone can figure something out.

hehe, absolutely true!

I found solution for my problem tho, gave position:relative to both container div and elements floating from inside div.


IE6 is a pain in the a**!