centrado

[fersosa]

hola! si. estuve viendo un poco más. me acerco a centrarlo pero no del todo. y quiero hacerlo responsive. ah y saqué un div innecesario.

Código HTML:

<!-- SECCION CONTENIDO -->
<div id="contenido">
 
 
  <div id="content">
   <fieldset id="desc">
    <legend><font color = "white">Narrativa</font></legend>
    
        
        
        <div id="tapanarrativa">
            <div class="boxnarrativa"><a href="http://www.forosdelweb.com/f53/horacio/elsilenciodelospajaros.html"><img src="http://www.forosdelweb.com/f53/horacio/images/tapaslibros/narrativa/elsilenciotapa.jpg" align="center"/></a>
                </div>
            
            <div class="boxnarrativa"><a href="http://www.forosdelweb.com/f53/horacio/fabril.html"><img src="http://www.forosdelweb.com/f53/horacio/images/tapaslibros/narrativa/fabriltapa.jpg" align="center"/></a>
                </div>
            
            <div class="box2"><a href="http://www.forosdelweb.com/f53/horacio/invenciontardia.html"><img src="http://www.forosdelweb.com/f53/horacio/images/tapaslibros/narrativa/invenciontardiatapa.jpg" align="center"/></a>
                </div>
            
            <div class="boxnarrativa"><a href="http://www.forosdelweb.com/f53/horacio/osodetrapo.html"><img src="http://www.forosdelweb.com/f53/horacio/images/tapaslibros/narrativa/osodetrapotapa.jpg" align="center"/></a>
                </div>
                </div>
           
         
           
    
    
   </fieldset>
  </div>
    </div>
 
    
</div>
 

Código CSS:

#content {
    width: 100%;
}
#content img {
    width: 85%;
    padding: 1%;
}
#contenido {
    width: 100%;
    padding: 0%;
    float: left;
    margin-left: auto;
    margin-right: auto;
}
#textogeneral {
    text-align: justify;
    padding: 10px 10px 10px 10px;
}
#textocentrado {
    text-align: center;
    padding: 10px 10px 10px 10px;
}
#tapanarrativa {
      width:60%;
      height: 100%;
      margin: 0 auto;
      text-align: center;
}
#narrativa {
    width:200px;
    height:200px;
    text-align: center;
    font: 200% Arial;
    word-wrap: break-word;
    white-space: nowrap;
}
.boxnarrativa{
width:250px;
height:350px;
background:#999;
float:left;
border:1px solid #444;
max-width:500px;
text-align: center;
}
 
.box2{
width:250px;
height:350px;
background:#999;
clear:left;
float:left;
border:1px solid #444;
max-width:500px;
text-align: center;
}