[Ovillo] Dt y dd en la misma línea

Mar Feb 17 15:52:14 UTC 2009

Hola a todos,

he estado buscando información sobre las listas de definición en las que el
dd y el dt estén en la misma línea, y no he encontrado una solución
completa.
El problema está cuando el texto incluido en el <dt> (con una anchura
fija) ocupa una altura mayor que el que ocupa el comprendido dentro de la
etiqueta <dd> (también con anchura fija), entonces el <dd> de la siguiente
fila se "sube" y ya no se sitúa en la misma fila que su correspondiente
<dt>. Sólo pasa en el ie, en el firefox funciona correctamente.

Lo mejor es verlo con un ejemplo sencillo, copio el código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="es" xmlns="http://www.w3.org/1999/xhtml" lang="es"><head>
  <title>Red Financiera</title>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="description" content="Red Financiera">
  <style>
   dl, dl * { margin: 0; padding: 0; margin-top:5px}
   dl{border:1px: solid red; width:650px}
   dt{width:150px; background-color:#FF0; float:left; clear:both}
   dd{width:500px; background-color:#CCC; float:left}

  </style>

 </head>

 <body>
  <dl>
            <dt>Item 1:</dt>
                 <dd>Definición 1.</dd>

            <dt>Item 2 Item 2 Item 2 Item 2 Item 2 Item 2 Item 2 Item 2 Item
2 Item 2 Item 2 Item 2 Item 2 Item 2:</dt>
                <dd>Definición 2 - Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Pellentesque varius. In fermentum sapien quis nisi volutpat
fermentum.
                </dd>
            <dt>Item 3:</dt>
             <dd>Definición 3.</dd>
        </dl>
 </body>

</html>

¿Sabéis como solucionarlo para que también funcione en el explorer?

Muchas gracias por adelantado.

Julia