Figure 4-64 shows a web page containing text from a Shakespearean sonnet. In this Coding Challenge, you will augment the text of the poem with background colors and images and add a graphic border.
Open the code4-1_back.css file and style rule for the figure element that:
- Set the padding space to 20 pixels.
- Adds a 20-pixel border in the ridge style with the color value rgb(52, 52, 180).
- Has a background consisting of the image file ws.png placed in the bottom right corner of the figure box and set to 45% of the width of the figure box with no tiling. Be sure to separate the position of the image and its size with the / character. Add a second background containing the color rgba(52, 52, 180, 0.3). Enter both background properties within a single style rule separated by a comma.
- Has a black box shadow that is 5 pixels to the right, 10 pixels down with a blur size of 15 pixels.
Within the code4-1_back.css file style rule for the figcaption that:
- Sets the font size to 1.8em.
- Centers the text of the caption.
- Adds a 2 pixel bottom solid bottom border of the color value rgb(52, 52, 180).