Search code examples
csspositioning

css positioning question


I'm trying for the life of me to figure out what should be an excruciatingly simple CSS task: aligning a block of text to the right of an image and vertically positioning the block so it aligns with the bottom of the image; and I'd prefer to not have to declare a height for the containing element as this is for a lengthy image listing and the dimensions will vary (but all with a certain max width/height). I've attempted to define a parent element with "position:relative" containing two left-floated divs, one with the image and the other with the text block, positioned "absolute" and "bottom:0" and I can't seem to get the text block to align with the bottom of the image...

any assistance here may very well help me stave off a fit of insanity ;)


Solution

  • If the text go to the right of the image, just use an element with display:inline-block after the image, and enclose everything in a block (like div). See it here