Foros del Web » Creando para Internet » CSS »

Listas de definición: DL, DT, DD

Estas en el tema de Listas de definición: DL, DT, DD en el foro de CSS en Foros del Web. Quisiera saber si es posible que, al realizar una lista de definición, tanto los valores de <dt> como los de <dd> quedaran en la misma ...
  #1 (permalink)  
Antiguo 08/05/2006, 17:36
 
Fecha de Ingreso: enero-2006
Ubicación: Maracay, Edo. Aragua
Mensajes: 206
Antigüedad: 11 años, 10 meses
Puntos: 0
Pregunta Listas de definición: DL, DT, DD

Quisiera saber si es posible que, al realizar una lista de definición, tanto los valores de <dt> como los de <dd> quedaran en la misma línea, sin importar cuan extensa sea la definición (<dd>).

Sé que existe una propiedad (compact) que hace esto, pero la misma solo los coloca en la misma linea cuando el espacio lo permite, es decir, si tanto el texto como la definición caben en la misma línea; además, no sé si este atributo se pueda controlar desde la hoja de estilos, pero igual, por lo antes dicho, creo que no se ajusta a mis necesidades.

Gracias.
  #2 (permalink)  
Antiguo 09/05/2006, 19:57
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Y bueno, a jugar con los márgenes.
No le veo otra forma más sencilla que modificar el margen de dd hasta que se ajuste, te sugiero probar con
Código:
dd {
 margin-left : 0px;
 }
Saludos.
  #3 (permalink)  
Antiguo 09/05/2006, 22:23
 
Fecha de Ingreso: enero-2006
Ubicación: Maracay, Edo. Aragua
Mensajes: 206
Antigüedad: 11 años, 10 meses
Puntos: 0
Nop, eso ya lo había probado, con eso al menos logré que se eliminara la sangría que, por defecto, deja el DD. Pero sigo sin poder hacer que se coloquen en la misma línea. Gracias de todos Modos.
  #4 (permalink)  
Antiguo 09/05/2006, 23:52
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
No es tan difícil lograrlo (probado en IE6, Opera y Firefox):

Tomemos en cuenta el siguiente HTML de ejemplo:
Código HTML:
<dl>
  <dt>Término 1</dt>
  <dd>Descripción 1</dd>
  <dt>Término 2</dt>
  <dd>Descripción 2</dd>
  <dt>Término 3</dt>
  <dd>Descripción 3</dd>
</dl> 
Aplicamos el siguiente CSS:
Código:
dt{
  width:100px;
  float:left;
  }
dd{
  margin-left:100px;
  margin-bottom:5px;
  }
Es un ejemplo tan sencillo que creo no necesita mayores explicaciones.
__________________
El conocimiento es libre: Movimiento por la Devolución
  #5 (permalink)  
Antiguo 24/05/2006, 10:43
 
Fecha de Ingreso: enero-2006
Ubicación: Maracay, Edo. Aragua
Mensajes: 206
Antigüedad: 11 años, 10 meses
Puntos: 0
Perfecto, muchas gracias
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:38.