QUESTION 1 Figure 1 shows a shopping cart summary with each row containing an image, product description, quantity and p

[answerhappygod]

Question 1 Figure 1 Shows A Shopping Cart Summary With Each Row Containing An Image Product Description Quantity And P 1 (246.52 KiB) Viewed 44 times

QUESTION 1 Figure 1 shows a shopping cart summary with each row containing an image, product description, quantity and price. The HTML code snippet is shown in Figure 2. бо </div> <div> <div class="desc"> RM99.00 8148587.jpeg?auto-compress&cs-tinysrgb&dpr=2&h=100" alt=""> <h3>Stylish Tote Bag</h3> <p>Brown Color Women's Tote Bag</p> <span> #368798</span> Stylish Tote Bag Brown Color Women's Tote Bag #368798 <div class="container"> <img src="https://images.pexels.com/photos/8148587/pexels-photo- <label>Quantity :</label> <input type="text" value="1" size="1" /> </div> <div class="price"> Sunglasses Glasses with wooden frame #756328 <div> Figure 1 </div> <div> </div> <img src="https://images.pexels.com/photos/1362558/pexels-photo- 1362558.jpeg?auto=compress&cs-tinysrgb&dpr=2&h=100" alt=""> <h3>Sunglasses</h3> <p>Glasses with wooden frame</p> <span>#756328</span> RM142.00 </div> <label>Quantity :</label> <input type="text" value="1" size="1" /> </div> <div class="price"> </div> Quantity: 1 Quantity: 1 Figure 2 RM99.00 RM142.00
Disregarding the generic style, create an internal CSS file that employs CSS Grid using the criteria listed below. ● ● ● A generic style for class container is with the margin of top and bottom 2 rem while left and right is auto. The max-width of the container is set to 800px with 2rem padding on all four sides. The container's background color is white (#ffffff). The class img have a width and height of 4.8rem. Set the object-fit property to cover. The class container is displayed in grid style and using repeat function to set the column. Set the gap of grid item with 2rem and 1rem justify the content with space in between. Set the class price with text align to the right.