Список определений IE7 - проблема выравнивания - PullRequest
Новая
       6

Список определений IE7 - проблема выравнивания

1 голос
/ 11 ноября 2011

У меня проблема с выравниванием с этим списком определений в Internet Explorer 7 (также Internet Explorer 5.5 и 6, но я буду рад, если смогу заставить его работать в ie7.)

Скриншот: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style type="text/css">
        .details dt {
            clear: left;
            float: left;
            width:100px;
            margin: 0;
            font-family:verdana;
            font-size:10px;
            font-weight: bold;
        }
        .details dd {
            float: left;
            margin: 0;
            font-family:verdana;
            font-size:10px;
        }
    </style>
</head>
<body>
    <dl class="details">
        <dt>Country:</dt>
        <dd>Canada</dd>

        <dt>State:</dt>
        <dd>Alberta</dd>
        <dt>City:</dt>
        <dd>Calgary</dd>
        <dt>District:</dt>
        <dd>Downtown</dd>

        <dt>Street:</dt>
        <dd>Main St</dd>
    </dl>
</body>
</html>

1 Ответ

2 голосов
/ 11 ноября 2011

Удалить очистить: влево и добавить ширину для дл.рабочий пример:

http://jsfiddle.net/sFxcE/1/

код: 

<head>
            <style type="text/css">
            .details dt {

            float: left;
            width:100px;
            margin: 0;
            font-family:verdana;
            font-size:10px;
            font-weight: bold;
            }

            .details dd {
            float: left;
            margin: 0;
            font-family:verdana;
            font-size:10px;
            }
            .details
             {
             width:200px;
             }


            </style>


            </head>

            <body>

            <dl class="details">
            <dt>Country:</dt>
            <dd>Canada</dd>

            <dt>State:</dt>
            <dd>Alberta</dd>
            <dt>City:</dt>
            <dd>Calgary</dd>
            <dt>District:</dt>
            <dd>Downtown</dd>

            <dt>Street:</dt>
            <dd>Main St</dd>
            </dl>


            </body>
            </html>
...