| <!doctype html> |
| <html> |
| <head> |
| <style type="text/css"> |
| .test-class { |
| margin: 50px auto; |
| background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iNDBweCIgaGVpZ2h0PSI0MHB4IiB2aWV3Qm94PSIwIDAgNDAgNDAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDQwIDQwIiB4bWw6c3BhY2U9InByZXNlcnZlIiBvdmVyZmxvdz0iYXV0byI+DQo8bGluZWFyR3JhZGllbnQgaWQ9IlNWR0lEXzFfIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUuODU3OSIgeTE9IjUuODU3OSIgeDI9IjM0LjE0MjEiIHkyPSIzNC4xNDIxIiBncmFkaWVudFRyYW5zZm9ybT0ibWF0cml4KDAuNzA3MSAwLjcwNzEgLTAuNzA3MSAwLjcwNzEgMjAgLTguMjg0MykiPg0KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiMwMEE5OTUiLz4NCgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojM0MzNzk1Ii8+DQoJPHN0b3AgIG9mZnNldD0iMC41MDU2IiBzdHlsZT0ic3RvcC1jb2xvcjojQTUzNTk0Ii8+DQoJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0RBMjEyOCIvPg0KPC9saW5lYXJHcmFkaWVudD4NCjxwb2x5Z29uIGZpbGw9InVybCgjU1ZHSURfMV8pIiBwb2ludHM9IjIwLDQwIDAsMjAgMjAsMCA0MCwyMCAiLz4NCjwvc3ZnPg==); |
| background-size: contain; |
| } |
| </style> |
| </head> |
| <body> |
| <div style="width: 100%;"> |
| <div class="test-class" style="width:60px; height:60px;"> |
| </div> |
| <div class="test-class" style="width:40px; height:40px;"> |
| </div> |
| <div class="test-class" style="width:28px; height:28px;"> |
| </div> |
| </div> |
| </body> |
| </html> |