Foros del Web » Creando para Internet » CSS »

Truncar un texto por pixels

Estas en el tema de Truncar un texto por pixels en el foro de CSS en Foros del Web. Hola a todos. Tengo una especie de informe donde muestro a cinco columnas una serie de oraciones en cinco idiomas distintos. Es decir, en cada ...
  #1 (permalink)  
Antiguo 18/04/2007, 16:51
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 11 meses
Puntos: 38
Truncar un texto por pixels

Hola a todos.

Tengo una especie de informe donde muestro a cinco columnas una serie de oraciones en cinco idiomas distintos. Es decir, en cada linea muestro una misma frase escrita en cinco idiomas diferentes.

Para que cada columna luzca igual, he usado letras tipo courier y he mostrado el mismo numero de caracteres en cada columna (no me importa si trunco los textos ya que al hacer click sobre una linea voy a mostrar las traducciones en detalle).

El resultado es mas o menos practico pero bastante horrible, por lo que estoy pensando en valerme de algun tag como el <div>, <span> o algun otro que no necesariamente me muestre sus bordes para poner dentro de ellos un texto largo sabiendo que va a quedar cortado por un atributo CSS.

Lo que quiero hacer es similar a que mi informe muestre a cinco columnas muchos elementos <input type='text'> del mismo ancho, pero sin mostrar cajas.

¿Que atributo CSS debo usar y sobre que elemento HTML debo aplicarlo?

Gracias de antemano.
  #2 (permalink)  
Antiguo 19/04/2007, 06:51
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 11 meses
Puntos: 38
Re: Truncar un texto por pixels

Bueno, logre una solución mas o menos adecuada, igual sigo pendiente por si algún gurú me propone algo mas satisfactorio.

Mi solución es esta:

Código PHP:
<html>
 <
head>
  <
style>

   .
info{
    
height20;
    
width160;
    
overflowhidden;
    
color#000000;
    
background-color#cccccc;
   
}

   .
space{
    
height20;
    
width50;
   }

  </
style>
 </
head>
 <
body>
  <
span class='info'>Este texto no se va a mostrar completo</span>
  <
span class='space'>&nbsp;</span>
  <
span class='info'>Este si</span>
  <
span class='space'>&nbsp;</span>
  <
span class='info'>Este puede ser pero no me importa</span>
 </
body>
</
html
Saludos.
  #3 (permalink)  
Antiguo 19/04/2007, 09:52
 
Fecha de Ingreso: marzo-2007
Mensajes: 19
Antigüedad: 17 años, 7 meses
Puntos: 0
Re: Truncar un texto por pixels

Hola!
Mira puedes hacer esto:
<style>
<!--
.info{
float:left;
height:20px;
width:160px;
background-color: #cccccc;
border-right:2px solid white;
font-family:arial;
font-size:12px;
}
-->
</style>

y en el cuerpo de la pagina:

<div class="info">Col1</div>
<div class="info">Col2</div>
<div class="info">Col3</div>
<div class="info">Col4</div>
<div class="info">Col5</div>

recuerda siempre de especificar las unidades de los atributos numericos, es muy importante ademas puedes encontrar referencias en esta web:
w3schools.com/css/default.asp
encontraras muchos tips y ejemplos que te ayudaran con tus css.Espero haberte ayudado. bye!
  #4 (permalink)  
Antiguo 19/04/2007, 12:08
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 11 meses
Puntos: 38
Re: Truncar un texto por pixels

Gracias lccliss.

Me parece un modo muy practico de resolver las columnas, no resuelve mi problema principal que es evitar que alguna de las columnas tome mas de una linea, pero eso ya lo estoy manejando con el overflow.

Voy a combinar el uso del float con el overflow y de seguro habre ganado simplicidad.

Gracias de nuevo.
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 22:03.