Imagen circular dinámica
Al hacer una imagen redonda con CSS3, normalmente solemos utilizar el siguiente código, o alguno parecido:
1 2 3 4 5 6 7 8 9 |
.circle { width: 50px; height: 50px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; overflow: hidden; background-color: #000; } |
Con este código solucionaremos prácticamente todos nuestros problemas, pero ¿Qué ocurre si queremos que este circulo sea dinámico y varíen sus dimensiones respecto a la ventana?