title: floating images in a layer, inside another layer
body: <p>I have the following HTML to center images and links within a layer:</p>
  
  <p>edit: a better example</p>
  
  <pre><code>&lt;style&gt; body  { 
  background-color:#000; 
  
  color: #FFF; 
  
  }  a  { font-family: "Broadway",
  Broadway,monospace;  font-size:
  14px; color:
  
  #FFF; }
  
  #images a {
  
   width: 24.99%;  display: block; 
  float: left;  text-align: center;  }
  
  #container; { top: 30%; left: 15%; }
  #main { position: absolute; width: 800px; height: 600px; }
  #logo { float:left; background-image:url("1.jpeg"); 
  width: 104; height: 100; }
  
  
   &lt;/style&gt; &lt;div id="main"&gt;  &lt;div
  id="logo"&gt; &lt;/div&gt; &lt;div
  id="container"&gt;  &lt;div id="images"&gt;
  &lt;a href="1.html" &gt;
      &lt;img src="1.gif" alt="x" width="181" height="173" border="0"
  /&gt;&lt;br /&gt;
      One &lt;/a&gt; &lt;a href="2.html" &gt;
      &lt;img src="2.gif" alt="x" width="181" height="173" border="0"
  /&gt;&lt;br /&gt;
      Two &lt;/a&gt; &lt;a href="3.html" &gt;
      &lt;img src="3.gif" alt="x" width="181" height="173" border="0"
  /&gt;&lt;br /&gt;
      Three &lt;/a&gt; &lt;a href="4.html" &gt;
      &lt;img src="4.gif" alt="x" width="181" height="173" border="0"
  /&gt;&lt;br /&gt;
      Four &lt;/a&gt; &lt;/div&gt;&lt;/div&gt;&lt;/div&gt;
  </code></pre>