centrar los div interiores

[evoarte]

hola,

¿cómo puedo centrar los div interiores?

Código HTML:

<div style="position:relative;">
 
<div style="position:relative;width:350px;float:left;">
  <div style="display:inline;position:relative;float:left;">
    <img src="rutaimagen1" alt="altimagen-1" />
  </div>
  <div style="display:inline;position:relative;left:10px">
   <div><a href="url1" target="_blank">ancla1</a></div>
   <div>texto1.</div>
  </div>
</div>
                
<div style="position:relative;width:350px;float:left;left:30px;">
  <div style="display:inline;position:relative;float:left;">
   <img src="rutaimagen2" alt="altimagen-2" />
  </div>
  <div style="display:inline;position:relative;left:10px">
   <div><a href="url2" target="_blank">ancla2</a></div>
   <div>texto2.</div>
  </div>
</div>
                
</div>
 

gracias,
un saludo,
josé carlos.

[pzin]

¿Cuáles interiores?

Ponerle a un elemento display:inline y luego float:left es una contradicción, ya que lo segundo hace que el elemento sea de bloque.

[evoarte]

estos div deberían quedar centrados en el contenedor,

Código HTML:

<div style="position:relative;width:350px;float:left;">
  <div style="display:inline;position:relative;float:left;">
   <img src="rutaimagen1" alt="altimagen-1" />
  </div>
  <div style="display:inline;position:relative;left:10px">
    <div><a href="url1" target="_blank">ancla1</a></div>
    <div>texto1.</div>
  </div>
</div>
<div style="position:relative;width:350px;float:left;left:30px;">
  <div style="display:inline;position:relative;float:left;">
    <img src="rutaimagen2" alt="altimagen-2" />
  </div>
  <div style="display:inline;position:relative;left:10px">
    <div><a href="url2" target="_blank">ancla2</a></div>
    <div>texto2.</div>
  </div>
</div>
 

gracias por tu respuesta,
un saludo.

[pzin]

¿Cual de ellos?

[evoarte]

los 2 deberían quedar centrados horizontalmente en el contenedor.

un saludo,
josé carlos.

[pzin]

Yo cuento diez div's ahí, a saber cuales son esos dos. Pero valdría algo así:

Código CSS:

margin: 0 auto; /* para si mismo */
text-align: center; /* para su contenido en línea, ah no que no vale que luego está flotado y es un elemento de bloque. Entonces mejor me olvido y paso a lo siguiente y los pongo como bloques en linea con inline-block... y ya vuelve a funcionar esta linea. A ver si cuando lo cambio no dejo el flotado ahí*/
 

La claridad de la respuesta va en relación a la de la pregunta.

[NestorCss]

Iniciado por Bonez

Yo cuento diez div's ahí, a saber cuales son esos dos. Pero valdría algo así:

Código CSS:

margin: 0 auto; /* para si mismo */
text-align: center; /* para su contenido en línea, ah no que no vale que luego está flotado y es un elemento de bloque. Entonces mejor me olvido y paso a lo siguiente y los pongo como bloques en linea con inline-block... y ya vuelve a funcionar esta linea. A ver si cuando lo cambio no dejo el flotado ahí*/
 

La claridad de la respuesta va en relación a la de la pregunta.

Se refiere que hay 2 bloques de div y dentro de cada uno tiene 4 div. Me viene bien esto, Gracias :D


Saludos!

[evoarte]

hola,



<div style="position:relative;width:350px;float:left;">
... contenido ...
</div>

<div style="position:relative;width:350px;float:left;">
... contenido ...
</div>

gracias por tu tiempo,
un saludo.

[pzin]

evoarte moléstate al menos un poco en explicar qué es lo que quieres concretamente.

[yoelrola]

si todo tiene float left jamas te va a quedar centrado, trata de dar un ejemplo