E Commerce product card sidebar
This is an example of a simple E-commerce product card sidebar, designed using HTML, CSS, and Bootstrap framework 4. The form consists of three tabs and one button. The three tabs are created as radio type tabs. The body of the form is given a background color as #eee, whereas the product card is given a style set of box-shadow as 0 0 5px rgba(0, 0, 0, 0.15), float as left, font-family as 'Lato', Arial, sans-serif, font-size as 16px, margin as 10px 1%, max-width as 310px, min-width as 250px, position as relative, text-align as left, and width as 100%. The description text of the card is displayed using a font-size of 12px, and a margin-top as 11px. The cursor style for the tabs is set as pointer to get the hand cursor effect in a hover event. The tabs are given the styles of border as 1px solid #8f37aa, display as inline-block, font color as #8f37aa, border-radius as 5px, font-size as 11px, and text-transform as uppercase to automatically convert the text to uppercase. The tabs change their background color to #8f37aa, in a hover event.