Hello!
I'm roughing out a layout for a new page, on which I've got two
columns, each containing a bunch of text and one small image. The
text in the columns is variable, but I'd like the pictures to align
vertically with each other, i.e. their tops should both begin at the
same point in their respective columns. Here's a quick diagram:
|<----------------------- 168px --------------------->|
+--------------------------+--------------------------+
| #LEFT | #RIGHT |
| | |
| | |
| | |
| | |
| | |
| +--------+ | +--------+ |
| | | | | | |
| | IMG | | | IMG | |
| | | | | | |
| +--------+ | +--------+ |
| | |
| | |
| | |
| | |
+--------------------------+--------------------------+
The markup is pretty simple...I'm using faux-columns to "float" the
content over two different colors:
#left {
float: left;
margin-left: 16px;
width: 322px;
}
#right {
margin-left: 342px;
margin-right: 16px;
}
And right now, the images are just styled as:
img.calendar {
float: right;
margin: 5px;
}
...and appear inline with the text:
<snip>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque,
id pulvinar odio lorem non turpis.</p>
<img src="images/calendar_green.gif" class="calendar">
<p>Nullam sit amet enim, etc.
...
</p>
</snip>
I've messed with absolutely positioning the images within their
columns, but that makes wrapping text around them a problem. Is there
a way to accomplish this, or should I just settle for their being a
little off, depending on the length of the preceding text in their
individual columns?
Thanks!
Jeff.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
