title: Css: cannot change size of <li>
body: <p>I asked a friend to help me with web site and I have to finish it by myself.
  I've got little screenshot boxes and I want to change their size, but I do not succeed. Those boxes are used for choosing a screenshot to show.
  I've got a Firefox addon that shows me the size of the screenshot box. And it's always constant - 25x25 pixels. I changed the CSS code but didn't succeed.
  Here is the HTML:</p>
  
  <pre><code>&lt;ul class="imgzchoose"&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/01.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/02.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/03.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/04.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/05.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/06.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src='data/images/screenshots/07.png' alt='' title='none'&gt;&lt;/li&gt;
  
  &lt;li&gt;&lt;img src='data/images/screenshots/08.png' alt='' title='none'&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And here is the CSS:</p>
  
  <pre><code>ul.imgzchoose{
  margin-left: 110px;
  padding-top:20px;
  width:185px;
  padding-bottom: 10px;
  }
  
  ul.imgzchoose li{
  float:left;
  position:relative;
  overflow:hidden;
  list-style:none;
  margin: 5px 5px;
  width: 50px;
  height: 50px;
  border: 1px solid #fff;
  }
  
  ul.imgzchoose li img{
  cursor:pointer;
  margin-left: 9px;
  margin-top: 1px;
  width:16px;
  height:24px;
  position:relative;
  display:none;
  }
  </code></pre>
  
  <p>What may the problem be?</p>
  
  <p>Thank you in advance.</p>