I need to display two images and some text like so:
------------------------------------------ img1--------some centered text-------img2 ------------------------------------------
- img1 and img2 are not the same dimensions, but their widths are very close
- The text is variable depending on the page in which it is displayed, and may include two lines instead of one.
- The text needs to centered horizontally between the two images, or between the outside of the container (either will be fine)
- the text AND the images need to be centered vertically within the container.
I can do this VERY easily with a table, but I'd rather not retreat to that for layout. The position:inline-block
and display:table-cell
attributes work great in some browsers, but I need to support IE6+.