Label, input, text-align and FF2

[Йода]

Всем привет.

Есть проблема со следующим кодом:

<style type="text/css">

.row{

width: 800px;

}

label{

display:-moz-inline-stack;

text-align: right;

display: inline-block;

width: 210px;

}

</style>

<div class="row" >

<label> Название учебного заведения </label>

<input type="text" />

<label> Тип документа </label>

<input type="text" />

</div>

<div class="row">

<label> Код учебного заведения </label>

<input type="text" />

<label> Номер документа </label>

<input type="text" />

</div>

Задача - выровнять label по правому краю.

Проблема - FF2 капризничает и не хочет слушаться.

Искал по инету, но решения не нашел.

Подскажите, пожалуйста, как справиться с такой проблемой.

[mishka]

Выбирай что больше подходит:

1. Забить на мертвый браузер FF2

2. Найти другое решение. Например флоатами.

Edited May 26, 2010 by mishka2

[SelenIT]

По идее, должно помочь, если в label вставить span с display:block, и width вместе с text-align'ом задать этому span-у. Проверить сейчас, к сожалению, не могу, т.к. сам давно последовал совету №1 из предыдущего коммента...

Edited May 26, 2010 by SelenIT

[mishka]

можна спану просто display:block; а все остальное оставить как есть.

[Йода]

Спасибо, значит display:-moz-inline-stack; не позволяет выравнивать, так что ли?

Подскажите как флоатами эффективней сделать эту же задачу.

[psywalker]

Спасибо, значит display:-moz-inline-stack; не позволяет выравнивать, так что ли?

Подскажите как флоатами эффективней сделать эту же задачу.

.row{

width: 800px;

float: left;

}

label{

float: left;

text-align: right;

display: inline-block;

width: 210px;

}

[Йода]

Такой вариант работает некорректно - правый лэйбл перескакивает на следующую строку

[mishka]

.row{
	height:1%; /* возможно придется вместо этого ставить zoom:1; а вообще, если на валидность пофиг, то можна сразу зум ставить */
	overflow:hidden;
}
label{
	float:left;
	width:300px;
	text-align:right;
}
input{
	float:left;
}

Edited May 27, 2010 by mishka2