[BUG] - Basic CSS: Size Your Image accepts second image element

Describe your problem and how to reproduce it:

This particular challenge will pass the tests with a second image element under specific conditions:

• The second image element must also reference the same cat photo url
• The second image element must come before the first

This code will pass the tests:

<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, monospace;
  }

  p {
    font-size: 16px;
    font-family: monospace;
  }
  .smaller-image {
    width: 100px;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>
<main>
  <p class="red-text">Click here to view more <a href="#">cat photos</a>.</p>

 <img src="https://bit.ly/fcc-relaxing-cat" class="smaller-image">

  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

This is a bit of a convoluted edge case, so I am not sure if it warrants a fix or not.

I believe it could be fixed by adding a test (or expanding the existing tests) to assert that $('img').length returns 1.

Related forum post: https://forum.freecodecamp.org/t/change-the-size-double-photo/432740

Add a Link to the page with the problem:

https://www.freecodecamp.org/learn/responsive-web-design/basic-css/size-your-images

Tell us about your browser and operating system:

• Browser Name: Chrome
• Browser Version:
• Operating System: Windows 10 v. 1909

If possible, add a screenshot here (you can drag and drop, png, jpg, gif, etc. in this box):

[RandellDawson]

I’m okay with leaving it as is - we do have an open PR linked to this issue, however.

@nhcarrigan You had responded to the user that nothing had been concluded. We can close this issue and then reference our decision to close this issue in that PR (and close it too).

[ShaunSHamilton]

I do not think we should make any change here. It is an odd edge case, to say the least.

The lesson is about adding a class. If the camper has added the class to one image, then they have accomplished the learning outcome.

If something has to change, I would vote for:

Create a class called smaller-image and use it to resize the existing image so that it's only 100 pixels wide.

⬆️ Added the word existing (I realise it is implied, but some do miss it)