In this challenge we were given a design of an animal card with its features. The purpose of the challenge was to translate the card into a real website and change that animal to the animal of our choice.
Things which were tested:
- The text is italicized for the animal’s interesting fact.
- The labels are bolded for the animal’s list items.
- The dots are removed from the animal’s list items.
- Uses border around animal’s name, image, and information (interesting fact, list items, and description).
- Uses border around animal’s information.
- Uses spacing between animal’s name, image, and information.
- The image’s alt is relevant to the animal used.
- The HTML includes classes that are used for styling.
- Classes are given meaningful names.
- Student separates HTML from CSS by linking to stylesheet.
- HTML code does not include elements or style attributes in the body.
- Card width should be fixed and include the spacing around the image (Since image is 300px wide, card should be 300px + spacing on either side. Card should not expand with the browser window).
- The image is 300px wide or the image’s width is set to 300px.