Невозможно отобразить комбинированный флажок / метку MVC в одной горизонтальной линии

Question

У меня есть MVC 4 ( Beta ) Просмотр со следующей разметкой:

<div id="ConsentToMarketingEmailsPart">
    @Html.LabelFor(m => m.ConsentToMarketingEmails)
    @Html.CheckBoxWithTooltipFor(m => m.ConsentToMarketingEmails, new { type = "checkbox", @checked = "checked" })
    @Html.ValidationMessageFor(m => m.ConsentToMarketingEmails)
</div>

Хотя я пробовал многошаблоны, вот пример простого стиля CSS, применяемого для визуализации Label -> then CheckBox в одной горизонтальной линии.

#ConsentToMarketingEmailsPart
{
    display:inline;
}

Независимо от того, чтоЯ делаю это всегда выглядит следующим образом в IE9:

Что я могу сделать, чтобы все это отображалось на одной строке?

Примечание : горизонтального пространства достаточно, поэтому перенос не должен быть проблемой.

ОБНОВЛЕНИЕ

---

Следующая разметка - это то, что в настоящее времявизуализируется:

<div id="ConsentToMarketingEmailsPart">
    <label for="ConsentToMarketingEmails">I consent to Marketing Emails</label>
    <input data-val="true" data-val-required="The I consent to Marketing Emails field is required." id="ConsentToMarketingEmails" name="ConsentToMarketingEmails" title="Indicates your willingness to except marketing emails" type="checkbox" value="true" /><input name="ConsentToMarketingEmails" type="hidden" value="false" />
    <span class="field-validation-valid" data-valmsg-for="ConsentToMarketingEmails" data-valmsg-replace="true"></span>
</div>

Теперь у него есть следующий стиль, который работает везде, кроме IE9:

#ConsentToMarketingEmailsPart
{
    display:inline;
}

#ConsentToMarketingEmailsPart label
{
    float: left;
}

Answer 1

Один путь такой.

<div id="ConsentToMarketingEmailsPart">
    <label>@Html.CheckBoxWithTooltipFor(m => m.ConsentToMarketingEmails, new { type = "checkbox", @checked = "checked" }) Checkbox Label </label>        
    @Html.ValidationMessageFor(m => m.ConsentToMarketingEmails)
</div>

Answer 2

У меня была такая же проблема, и я нашел реальное решение, как показать флажок и метку в строке

@Html.CheckBoxFor(m => m.RememberMe)
@Html.LabelFor(m => m.RememberMe, new { @class = "checkbox" })

Решение взято из шаблона интернет-приложения MVC 4.

Answer 3

Выяснил проблему ... Элемент Label имел альтернативный дисплей , установленный на более высоком уровне в документе. В IE9 это переведено на результат, который вы видели в вопросе. Здесь был оскорбительный CSS.

frameset label 
{ 
    display: block; 
}

Answer 4

Попробуйте переместить метку влево:

label {
    float: left;
}