Ответ 1
Использование CSS, конечно...
label { display: block; width: 100px; }
Атрибут width
устарел, и CSS всегда должен использоваться для управления этими типами презентационных стилей.
В теге метки нет свойства 'width', поэтому как я должен управлять шириной метки метки?
Использование CSS, конечно...
label { display: block; width: 100px; }
Атрибут width
устарел, и CSS всегда должен использоваться для управления этими типами презентационных стилей.
Использование встроенного блока лучше, потому что оно не заставляет остальные элементы и/или элементы управления рисоваться в новой строке.
label {
width:200px;
display: inline-block;
}
Отображаются встроенные элементы (например, SPAN, LABEL и т.д.), поэтому их высота и ширина вычисляются браузером на основе их содержимого. Если вы хотите контролировать высоту и ширину, вам нужно изменить блоки этих элементов.
display: block;
делает элемент отображаемым в виде сплошного блока (например, теги DIV), что означает, что после элемента происходит разрыв строки (он не встроен). Хотя вы можете использовать display: inline-block
, чтобы исправить проблему разрыва строки, это решение не работает в IE6, потому что IE6 не распознает встроенный блок. Если вы хотите, чтобы он был совместим с несколькими браузерами, посмотрите на эту статью: http://webjazz.blogspot.com/2008/01/getting-inline-block-working-across.html
Предоставление ширины меток не является правильным способом. вам нужно взять одну структуру div или таблицы для управления этим. но если вы не хотите изменять весь код, вы можете использовать следующий код.
label {
width:200px;
float: left;
}
label {
width:200px;
display: inline-block;
}
OR
label {
width:200px;
display: inline-flex;
}
OR
label {
width:200px;
display: inline-table;
}
Вы можете либо присвоить имя класса всем ярлыкам, чтобы все могли иметь одинаковую ширину:
.class-name { width:200px;}
Пример
.labelname{ width:200px;}
или вы можете просто дать остальную метку
label { width:200px; display: inline-block;}
Вы можете определенно попробовать этот способ
.col-form-label{
display: inline-block;
width:200px;}