Previous Message
Next Message

Re: [css-d] Vertical-Alignment Issue

Sent by Ian Leckie on 13 May 2002 18:06


I think a test page showing what you have tried would be in order here... I
am a little confused as to what you are trying to do.

if you do indeed have two <div>s floated next to each other, then each will
only be as tall as their individual contents, unless you explicitly specify
a height. something like this:

----------- ---------
|blah blah| | image |
|blah blah| ---------
|blah blah|
|blah blah|
|blah blah|
|blah blah|
|blah blah|
|blah blah|
-----------

if you have a <div> that only contains an image, that div is only as tall as
the image is and therefore there is no alignment that can be done. if you
have applied a height to the div, then setting padding-top on the div or
margin-top on the image to (height of the div) - (height of the image)
should accomplish what you're after.

if you are trying to replicate a table laid out like this:

---------------------
|blah blah|         |
|blah blah|         |
|blah blah|         |
|blah blah|         |
|blah blah|         |
|blah blah|---------|
|blah blah|| image ||
|blah blah|---------|
---------------------

then you may have to wrap the <div> with the textual content in the <div>
with the image and relatively position the image to the bottom of the
containing <div>, which may break some browsers (as others have pointed
out). that's a failing of the browser makers, not of the spec ;-)

(not to mention that according to the spec, you should be able to do this
with one content <div> and an absolutely positioned image... )


On 5/12/02 5:51 AM, "Stephen Qualtrough" [EMAIL-REMOVED]> wrote:

> Yes I was trying to avoid using a table, basically i had a 2 column (divs)
> layout. The content in the left handside was always dynamic or editable so I
> could not have a fixed height. In the right handcolumn, I always wanted an
> image to align to the bottom of the div. However much I tried I couldn't
> align the image to the bottom, do you know if this is at all possible in any
> browsers (I am tying to eliminate whether it is me thats at fault ?) Should
> I be putting the attribute on the image or the division ? I ended up putting
> fixed 'margin-top' positions to push the image to the bottom, which was
> really unpretty.

---
Ian Leckie
Interactive Developer
The Integer Group
[EMAIL-REMOVED]
p: 515.247.2646
c: 515.710.2646
Previous Message
Next Message

Message thread:

Possibly related: