Foros del Web » Creando para Internet » CSS »

Elemento de una sola linea

Estas en el tema de Elemento de una sola linea en el foro de CSS en Foros del Web. Buenas a todos, Tengo una duda. Estoy trabajando con una tabla con una celda que tiene un contenido dinamico, que cambia el numero de letras ...
  #1 (permalink)  
Antiguo 13/02/2013, 16:44
Avatar de 0123  
Fecha de Ingreso: noviembre-2012
Ubicación: Entre la consola, el coda y un poco de photoshop
Mensajes: 263
Antigüedad: 12 años
Puntos: 10
Elemento de una sola linea

Buenas a todos,

Tengo una duda. Estoy trabajando con una tabla con una celda que tiene un contenido dinamico, que cambia el numero de letras que tiene. Puede tener 10 o 200 letras.

El problema es que esto hace que la celda aumente de altura cuando su contenido es mas ancho que la celda.

Me preguntaba si existe alguna forma de hacer que la celda siempre tenga la altura de una linea. No queria indicar un HEIGHT en pixeles. He pensado en usar un <span> con posicion absolute dentro de la celda, creo que es la unica opción.

¿Existe alguna forma mas estandar?... he pensado que igual existe algo en CSS3... :D

¿Sabeis?

EDITO: para dejarlo mas claro, que me explico fatal, lo que quiero es que un elemento tenga siempre una sola linea, aunque su contenido tenga mucho texto. ¿Es posible?, quiero que una celda siempre tenga la altura de una linea de texto sin indicar un determinado numero de pixeles.

Última edición por 0123; 13/02/2013 a las 17:04
  #2 (permalink)  
Antiguo 13/02/2013, 17:18
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Elemento de una sola linea

Es posible, además de simple y estar desde CSS1:

Código CSS:
Ver original
  1. .unalinea {
  2.   white-space: nowrap;
  3. }

Así fuerzas a que esté siempre en una sola linea. Pero te va a crecer lateralmente. Aunque eso parece que no te importa.
  #3 (permalink)  
Antiguo 14/02/2013, 18:46
Avatar de 0123  
Fecha de Ingreso: noviembre-2012
Ubicación: Entre la consola, el coda y un poco de photoshop
Mensajes: 263
Antigüedad: 12 años
Puntos: 10
Respuesta: Elemento de una sola linea

Muchas gracias Bonez!...

No conocia esa propiedad. Un tonteria espectacular!.

Un saludo!
  #4 (permalink)  
Antiguo 15/02/2013, 07:23
 
Fecha de Ingreso: octubre-2010
Ubicación: La Plata
Mensajes: 63
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: Elemento de una sola linea

Otra forma, ademas de la que dice Bonez, es en la celda de la tabla, agregarle un scroll. Si queres saber como, pedilo y te lo publico. ;)
  #5 (permalink)  
Antiguo 16/02/2013, 11:31
Avatar de 0123  
Fecha de Ingreso: noviembre-2012
Ubicación: Entre la consola, el coda y un poco de photoshop
Mensajes: 263
Antigüedad: 12 años
Puntos: 10
Respuesta: Elemento de una sola linea

Buenas leoass,

Gracias, estoy aun dandole vueltas, es un tema complejo este.

Puedes publicar tu idea?... :D... a ver si me vale :P.
  #6 (permalink)  
Antiguo 17/02/2013, 01:44
Avatar de alex_dh  
Fecha de Ingreso: septiembre-2011
Ubicación: Kreuzberg
Mensajes: 235
Antigüedad: 13 años, 2 meses
Puntos: 14
Respuesta: Elemento de una sola linea

Cita:
Iniciado por 0123 Ver Mensaje
Buenas leoass,

Gracias, estoy aun dandole vueltas, es un tema complejo este.

Puedes publicar tu idea?... :D... a ver si me vale :P.
el scroll le agregas para que aparesca la "ruedita" al costado de la pagina o de la celda, esta aparece automaticamente si hay un contenido que sobrepasa las dimenciones de la celda/div

Código CSS:
Ver original
  1. overflow: auto;
__________________
Avanzado desarrollador HTML, CSS y programador PHP, MYSQL, JAVASCRIPT

=========CALLEJEROS INOCENTES=========
  #7 (permalink)  
Antiguo 18/02/2013, 05:05
 
Fecha de Ingreso: octubre-2010
Ubicación: La Plata
Mensajes: 63
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: Elemento de una sola linea

Cita:
Iniciado por 0123 Ver Mensaje
Buenas leoass,

Gracias, estoy aun dandole vueltas, es un tema complejo este.

Puedes publicar tu idea?... :D... a ver si me vale :P.
Es simple. Al div que uses, le das la propiedad "overflow" con el atributo "scroll"

Ejemplo:
Código CSS:
Ver original
  1. .div
  2. {
  3.     overflow:scroll;
  4. }
  #8 (permalink)  
Antiguo 18/02/2013, 05:13
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Elemento de una sola linea

No me parece una buena idea hacer que las celdas tengan un scroll. En Windows se verán barras de desplazamiento horribles y la experiencia del usuario se verá afectada también de forma negativa.

Etiquetas: altura, ancho, css3, elemento, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:04.