VPF::Выровнять SPAN'ы по левому и правому краю

Royan

Дата 26.3.2009, 00:31 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

Имеется такой HTML/CSS код

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<META http-equiv="content-type" content="text/html; charset=utf-8" />
<TITLE>Тест</TITLE>
<STYLE type="text/css">
.orderField {
    width: 100%;
}

.fieldInfo {
    text-align: left;
}

.serviceInfo {
    width: 100%;
    text-align: right;
}
</STYLE>
</HEAD>
<div class="orderField">
    <span class="fieldInfo">
        Left
    </span>
    <span class="serviceInfo">
        Right
    </span>
</div>
</BODY>
</HTML>

Требуется, чтобы слова "Left" и "Right" были выровнены, соответственно по левому и правому краю. Как это сделать без помощи таблицы не пойму...

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

Soah

Дата 26.3.2009, 00:49 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 2
Всего: 54

Код


.serviceInfo {
    float: right;
    text-align: right;
}

Royan

Дата 26.3.2009, 01:16 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

Soah, Спасибо, но в таком случае появляется неприятный глюк строка "Right" выводится несколько ниже (по высоте) чем строка "Left"

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

Soah

Дата 26.3.2009, 01:23 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 2
Всего: 54

Royan, width: 100% убрал?

Это сообщение отредактировал(а) Soah - 26.3.2009, 01:24

Royan

Дата 26.3.2009, 02:42 (ссылка)

(нет голосов)

Загрузка ...

Dreamer

Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15

Soah, Убрал, вот посмотри скриншот, может что не так?

А вообще у меня вот такой сейчас код:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<META http-equiv="content-type" content="text/html; charset=utf-8" />
<TITLE>Тест</TITLE>
<STYLE type="text/css">
.orderField {
    width: 100%;
}

.fieldInfo {
    text-align: left;
}

.serviceInfo {
    float: right;
    text-align: right;
}
</STYLE>
</HEAD>
<div class="orderField">
    <span class="fieldInfo">
        Left
    </span>
    <span class="serviceInfo">
        Right
    </span>
</div>
</BODY>
</HTML>

Присоединённый файл ( Кол-во скачиваний: 8 )

bug.PNG 27,21 Kb

--------------------

Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь

Soah

Дата 26.3.2009, 11:33 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 512
Регистрация: 18.2.2009

Репутация: 2
Всего: 54

Код


<div class="orderField">
    <span class="serviceInfo">
        Right
    </span>
    <span class="fieldInfo">
        Left
    </span>
</div>

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »