Foros del Web - Varios DIV en una sola linea

Foros del Web (http://www.forosdelweb.com/)

- CSS (http://www.forosdelweb.com/f53/)

- - Varios DIV en una sola linea (http://www.forosdelweb.com/f53/varios-div-sola-linea-584984/)

Alejo18

10/05/2008 10:56

Varios DIV en una sola linea

Buenas como haría varios divs que esten en una sola linea y no se vayan para abajo

Al poner

Código HTML:

<DIV>
 <div>10</div>
 <div>20</div>
 <div>30</div>
 <div>40</div>
 <div>50</div>
 </DIV>

Se pone uno debajo de otro
http://img229.imageshack.us/img229/7...ebottomgj4.gif

Ahora si pruebo asi,

Código HTML:

<div>

  <div style="float:left">10</div>

  <div style="float:left">20</div>

  <div style="float:left">30</div>

  <div style="float:left">40</div>

  <div style="float:left">50</div>
 </div>

http://img164.imageshack.us/img164/8596/1lineuz4.gif

Bien no se saltan los divs para abajo quedan en una sola linea, ahora la pregunta es si hay algun otro metodo para juntar todos esos divs sin tener que poner float:left, pero que queden en una sola linea, asi como lo hace <td></td> en tablas, gracias y saludos

Raulmmmm

10/05/2008 13:06

Re: Varios DIV en una sola linea

Al div que los contiene le puedes poner un id, por ejemplo contenedor:

Código HTML:

<div id="contenedor">
 <div>10</div>
 <div>20</div>
 <div>30</div>
 <div>40</div>
 <div>50</div>
 </div>

Y entre <head> y </head> puedes poner esto:

Código HTML:

<style>

#contenedor div{ float:left; }
 </style>

Alejo18

10/05/2008 14:09

Re: Varios DIV en una sola linea

Muchas gracias ya lo aplique una pregunta, pero si el contenedor mide 50px, como haria para que todos los divs de dentro se coloquen al centro o enmedio

asi como indica el rectangulo rojo
http://img353.imageshack.us/img353/1364/centerza3.gif

Lo unico que puedo hacer es ponerle padding- pero se hace muy dificil cuantos pixeles hay del inicio al enmedio y más si el contenedor es mas grande.

saludos y Gracias nuevamente.

Mikmoro

10/05/2008 15:53

Re: Varios DIV en una sola linea

Usando line-height: 30px; o los px que tú quieras.

No obstante, me da la sensación de que quieres tabular datos. Si es así, debes usar una tabla. Las tablas no se deben usar para posicionar elementos o maquetar, pero sí para tabular datos.

Mikel.

Raulmmmm

11/05/2008 02:29

Re: Varios DIV en una sola linea

Pues, tal como te dice Mikel, si el contenedor mide 50px de alto, basta con que le pongas un line-height de 50px. El CSS quedaría así:

Código HTML:

<style>

#contenedor{ height: 50px; line-height: 50px; }

#contenedor div{ float:left; }
 </style>

codeams

23/12/2012 04:07

Respuesta: Varios DIV en una sola linea

Código CSS:

Ver originaldiv{display:inline;}

De esa manera los divs no provocarán el "salto de línea"

La zona horaria es GMT -6. Ahora son las 05:39.