HTML CSS examples for CSS Widget:Table Width
Centering: display table and img with max-width
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body {<!-- w w w .j av a 2s .c o m--> text-align:center; } figure { position:relative; display:inline-block; margin:0 auto; max-width:100%; } figcaption { position:absolute; top:0; left:0; width:100%; height:100%; background:red; -webkit-opacity:0.6; -moz-opacity:0.6; -ms-opacity:0.6; opacity:0.6; } img { max-width:100%; vertical-align:middle; } </style> </head> <body> <figure> <img src="https://www.java2s.com/style/demo/InternetExplorer.png" alt=""> <figcaption></figcaption> </figure> </body> </html>