Jason Stacy wrote:
On a webpage I would like to move image1.jpg as left as possible (directly to the browser window left border)
and - simultaneously - the picture image2.jpg to the rightmost (directly to the right browser window border).
How do I code this in HTML resp. CSS?
If the user shrinks the browser window to a size which is smaller than the sum of the size
of the two images image1.jpg + image2.jpg then all browser tend to position these pictures
vertically. But: I don't want a "line wrap". If the horizontal size doesn't fit then
the right picture image.jpg should be truncated.
Is there a solution for this?
Absolute positioning.
<div style="position: absolute; top: 0; right: 0; width: 200px;"><img
src="..."></div>
<div style="position: absolute; top: 0; left: 0; width: 200px;"><img
src="..."></div>
should do it (untested) for 200px-wide images. Of course, style
information should be in a separate style sheet rather than inline.
Note that I put the right image first in the source, to achieve your
requirement that it goes "under" the left image - I presume that's what
you intend when you say "truncate".
If you want these to be relative to a containing element rather than the
browser window, put them inside a <div> with position: relative set.
--
Mark.
http://tranchant.plus.com/