title: CSS stylesheet: style for one button specifically
body: <p>this is my HTML code:</p>
  
  <pre><code>&lt;button name='q1.button1' id='q1.button1' onclick='incorrect()' &lt;/button&gt;
  </code></pre>
  
  <p>and this is my CSS file:</p>
  
  <pre><code>.q1.button1 {
    width: 500px;
    height: 250px;
    background-image: url('images/buttons/q1.button1.jpg');
  }
  
  </code></pre>
  
  <p>i also tried:</p>
  
  <pre><code>#q1.button1 {
    width: 500px;
    height: 250px;
    background-image: url('images/buttons/q1.button1.jpg');
  }
  
  </code></pre>
  
  <p>but none of them work, the button is just a big white box!</p>
  
  <p>i thought there could be a problem with the HTML so I tried the following and it worked:</p>
  
  <pre><code>Button {
    width: 500px;
    height: 250px;
    background-image: url('images/buttons/q1.button1.jpg');
  }
  
  </code></pre>
  
  <p>however, i cant use this because each button has to be different but this will change all buttons</p>