CSS centering text between two images

I need to display two images and some text:

------------------------------------------
img1 -------- some centered text ------- img2
------------------------------------------
  • img1 and img2 are not the same size, but their width is very close.
  • The text is variable depending on the page on which it is displayed, and may include two lines instead of one.
  • The text should be centered horizontally between the two images or between the outside of the container (or it will be fine)
  • text AND images should be centered vertically inside the container.

I can do it VERY easily with the table, but I would prefer not to back down for the layout. Attributes position:inline-blockand display:table-cellwork fine in some browsers, but I need to support IE6 +.

+3
source share
1 answer
<style type="text/css">
#image1 { float: left; }
#image2 { float: right; }
#text { text-align: center; }
</style>
+4
source

Source: https://habr.com/ru/post/1749264/


All Articles