Close

Avatars on cards

This is an example of a web form with a responsive avatar card layout, designed using HTML, JavaScript, and CSS. The images have been added to the form with their image URLs imported. JavaScript functions have been used to implement the responsive animations on the avatar cards. The body of the form is given a background color of #08202B and the overflow-x property is set as hidden clip the content. Two navigational links: Directors and Contact have been given the styles of font-family as 'GTAmericaExpanded', sans-serif, font-size as 2.4rem, color as #fff, font-weight as 900, line-height as 1.2em text-transform as uppercase to automatically convert the text to uppercase, and cursor as pointer to display the hand cursor. The avatar module has the styles of width: 100%, position: absolute, top: 50%, left: 50%, and transform: translate(-50%,-50%) whereas avatar name is given the styles of width: 100%, font-family: 'GTAmericaExpanded',sans-serif, font-size: 1.2rem, color: #fff, font-weight: 800, text-align: center, transform: translateY(-50%), and transition: all 0.2s.

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.