[SOLUCIONADO] inline-block y el posicionamiento

[disenosergio]

Buenas tardes:
Me gustaría que me explicaran como puedo en un contenedor situar varias etiquetas display:inline-block de una manera precisa.
Se que se puede flotar los elementos y que posicionandolos en absolute puede hacerce pero a la hora de redimensionar la ventana del navegador no se acopla al contenedor original por lo que tengo problemas en un diseño elastico.

Gracias de antemano

[pzin]

¿Y dónde quieres ponerlas? ¿A la izquierda? ¿A la derecha? ¿Al centro? ¿Arriba? ¿Abajo? ¿A 10 pixeles de la izquierda?

Cuando tu pregunta genera más preguntas es que la tuya no fue lo bastante concisa.

[disenosergio]

Bueno era una pregunta generica para saber el procedimiento que debo tomar para ir moviendolos dependiendo de una plantilla definida.
Pero si me mandas un contenedor con tres elementos inline-block posicionados como quieras te lo agradeceria.
Gracias por tu rapidez

[pzin]

¿Moviéndolos a dónde?

Para elegir un lugar concreto puedes ir moviéndolos cambiando su posición a una relativa o absoluta. Aunque depende del caso, pueden haber mejores soluciones, más limpias. Por eso preguntaba.

[disenosergio]

Si poner el contenedor en relative y los elementos en absolute y moverlos con top,left,right o bottom, pero lo que pasa es que si lo hago asi, a la hora de probarlo en resoluciones más pequeñas se desborda del contenedor y no se adapta.

[pzin]

Obviamente. Por eso es malo usar posicionamiento absoluto.

Lo que nos devuelve a mi duda inicial ¿cómo quieres colocarlos?

[disenosergio]

Por ejemplo un contendor principal y tres inline-block.
Uno a la derecha, otro en el centro y otro a la izquierda y alineados los tres.
Gracias

[pzin]

Esta puedes usarlo con tres elementos como necesitas, con diez o con dos. Como necesites.

Código CSS:

div#contenedor {
  text-align: justify;
  text-justify: distribute-all-lines;
}
 
div.cajas {
  display: inline-block;
  width: 50px;
  height: 50px;
}
span.estirar {
  display: inline-block;
  width: 100%;
}
 

Código HTML:

<div id="contenedor">
  <div class="cajas"></div>
  <div class="cajas"></div>
  <div class="cajas"></div>
  <span class="estirar"></span>
</div>
 

Siempre quedará una caja a la izquierda y otra a la derecha, las intermedias quedarán centradas.

[disenosergio]

Muchas gracias por tu respuesta me has solucionado una duda bastante importante.
Saludos