Image Align problems

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
I've got a simple piece of HTML that displays some text on the
screen.  Within this there are images, alternately aligned left and
the other aligned right.  The idea is to create a border of images
using this method.

It works fine with FF2.0 but on IE6 the right aligned images aren't
lining up as expected.  The entire output is within a CSS div set to a
width of 650px, so I am expecting the right aligned images to be in a
straight line, up against the right hand side of this div.  In FF they
are, but in IE6 they are tagged at the end of the text within the div,
that has been centered, giving a line of images that isn't straight.

Any ideas how I might solve this so that the images are in a straight
line for all browsers?


I can post the code if you need more info, or a link to it etc.

Re: Image Align problems

Just in case you need to see the page it's here:

It's a dynamic page generated using PHP, so on the form you just need
to choose "cars" from the bottom right dropdown and then submit, the
problem occurs on the following output page, the right hand side
images aren't in a line using IE6 wheras they are using FF2.

This is purely a prototype so there may well be validation errors,
I've not checked for that yet, maybe that's the problem?

Re: Image Align problems


Quoted text here. Click to load it

Well, always validate before bughunting. It's a waste of time trying to  
get it right if it ends up just an error somewhere easily fixed :) (no  
doctype, no starting body tag...)

Rik Wasmus

Re: Image Align problems

I've managed to get the code to validate with no errors and the
problem is still there, anyone else got any idea what it might be?

Actually scratch that, I fixed it.

It was a pretty dumb error, I'm embarrassed to admit it, I had another
image slightly overlapping on the horizontal position which prevented
the other image from lining up to the right, not sure why it worked on
FF, maybe something to do with padding?

Anyway, fixed now, sorry to bother you!

Re: Image Align problems

Quoted text here. Click to load it

Not true:


Re: Image Align problems

Quoted text here. Click to load it

That wasn't the page that was giving the problems, although I will
also fix that before putting the site live, thanks.

There is still an issue as I reuse the same divs over and over again
and the validator doesn't like it:

 Line 27, Column 11: ID "main" already defined.
<div id = 'main'>
An "id" is a unique identifier. Each time this attribute is used in a
document it must have a different value. If you are using this
attribute as a hook for style sheets it may be more appropriate to use
classes (which group elements) than id (which are used to identify
exactly one element).

Is there a straightforward way to fix this, other than nopt using the
same div over and over?

Site Timeline