Merge pull request #483 from jasonguf/fix_images_in_index_page

04-chaining-selectors: Updated index.html and README.md

Author: thatblindgeye

foundations/04-chaining-selectors/README.md

@@ -7,8 +7,6 @@ With this exercise, we've provided you with a partially completed HTML file whic
 
 We have two images for you to style, each with two class names, where one of the class names is shared. The goal here is to chain the selectors for both elements, so that each have a unique style applied, despite using a shared class selector. For example, you want an element that has both X and Y to have one set of styles, while an element with X and Z has a completely different set of styles. We included the original images as well, so that you can see how the styles you will be adding look in comparison, so do not add any styles to them.
 
-**Note:** Download and group the images in a separate "images" folder. Ensure correct image source paths in your HTML to avoid image loading issues. This is crucial for a cleaner project structure.
-
 The properties you need to add to each element are:
 
 * Make the element with both the `avatar` and `proportioned` classes 300 pixels wide, then give it a height so that it retains its original square proportions (don't hardcode in a pixel value for the height!).

foundations/04-chaining-selectors/pexels-andrea-piacquadio-3777931.jpg renamed to foundations/04-chaining-selectors/images/pexels-andrea-piacquadio-3777931.jpg

@@ -11,13 +11,13 @@
     <!-- Check image source path. Review Foundations lesson - Links and Images -->
     <!-- Use the classes BELOW this line -->
     <div>
-      <img class="avatar proportioned" src="" alt="Woman with glasses">
-      <img class="avatar distorted" src="" alt="Man with surprised expression">
+      <img class="avatar proportioned" src="./images/pexels-katho-mutodo-8434791.jpg" alt="Woman with glasses">
+      <img class="avatar distorted" src="./images/pexels-andrea-piacquadio-3777931.jpg" alt="Man with surprised expression">
     </div>
     <!-- Use the classes ABOVE this line -->
     <div>
-      <img class="original proportioned" src="" alt="Woman with glasses">
-      <img class="original distorted" src="" alt="Man with surprised expression">
+      <img class="original proportioned" src="./images/pexels-katho-mutodo-8434791.jpg" alt="Woman with glasses">
+      <img class="original distorted" src="./images/pexels-andrea-piacquadio-3777931.jpg" alt="Man with surprised expression">
     </div>
   </body>
 </html>