title: CSS- Targeting multiple images inside a div
body: <p>I'm attempting to add individual borders to each image inside of a div. Currently I have a border around the entire section that holds the photos, but I'm trying to get the actual image itself.</p>
  
  <p>Below is an example of the html</p>
  
  <pre><code>&lt;div id="options"&gt;
   &lt;img id="rock" src="rock.jpg" name="rock" width="265" height="250" /&gt;
  
   &lt;img id="paper" src="paper.jpg" name="paper" width="265" height="250" /&gt;
   &lt;img id="scissors" src="scissors.jpg" name="scissors" width="265" height="250" /&gt;
   &lt;img id="lizard" src="lizard.jpg" name="lizard" width="265" height="250" /&gt;
   &lt;img id="spock" src="spock.jpg" alt="spock" width="265" height="250" /&gt;
  
  &lt;div id="compPick"&gt;
   &lt;img id="blank" src="blankpic.jpg" name="blank" width="265" height="250" /&gt;
  &lt;/div&gt;
   //div below ends the option div
  &lt;/div&gt;
  </code></pre>
  
  <p>below is my current css</p>
  
  <pre><code> #options{
  text-align: center; 
  border: 2px solid #333333;
  background-color: #D0CECE;
  display: block;
   }
  
   #compPick{
  text-align: center; 
  border: 2px solid #333333;
  padding: 5px;
   }
  </code></pre>
  
  <p><code>compPick</code> is a blank image that changes depending on a randomly generated number/choice. I'd like to keep the border around the sections, but I also would like the border around the images themselves.</p>
  
  <p>Thank you for your help.</p>