Разбить отображение на несколько строк для метки привязки

Мне нужно отображать текст на несколько строк, я использую бутстрап, и он разделен на 2 строки, когда ширина завершена, но может ли это разбить линию, когда мне нужно сломать?

@Html.ActionLink("Non-Owned & Hired Auto", "", "", new { id=1}, new { })

В приведенном выше коде автоматический разрыв строки после нанятого слова, но я хочу разбить строку после этого и подписать (&). Пожалуйста, помогите мне, как это сделать.

Я использую Asp.net Mvc с Razor View Engine.

Ниже приведен код просмотра html.

<div> <aside id="sidebar"> <nav id="side-nav"> <ul role="tablist"> <li id="basicDetailMenu">@Html.ActionLink("Basic", "", "", new { id = 1}, new { })</li> <li id="generalInfoMenu">@Html.ActionLink("General", "", "", new { id=1}, new { })</li> <li id="priorCarrierMenu">@Html.ActionLink("Prior Carrier", "", "", new { id=1}, new { })</li> <li id="propertyCoverageMenu">@Html.ActionLink("Property Coverage", "", "", new { id=1}, new { })</li> <li id="liabilityCoverageMenu">@Html.ActionLink("Liability Coverage", "", "", new { id=1}, new { })</li> <li id="nonOwnedMenu">@Html.ActionLink("Non-Owned & Hired Auto", "", "", new { id=1}, new { })</li> <li id="liquorLiabilityMenu">@Html.ActionLink("Liquor Liability Coverage", "", "", new { id=1}, new { })</li> <li><a href="#tab5" role="tab" data-toggle="tab" target="_blank">Additional</a></li> <li><a href="#tab6" role="tab" data-toggle="tab" target="_blank">Other</a></li> </ul> </nav> </aside>
</div>

И вот css

#sidebar{ overflow:hidden; margin:0 0 15px;
}
#side-nav{ overflow:hidden; display:block;
}
#side-nav ul{ margin:0; padding:0; list-style:none;
}
#side-nav ul li{ font-size:14px; border-top:1px solid #465667;
}
#side-nav ul li a{ color:#9eabba; padding:15px; display:block; background:#293440; transition:.5s all; height:50px; line-height:18px;
}
#side-nav ul li a span{ float:left;
}
1 ответ

Добавьте возврат каретки в текст (добавьте имя класса заметок для стилизации)

@Html.ActionLink("Non-Owned & \rHired Auto", "", "", new { id = 1 }, new { @class = "newlinelink" })

а затем используйте css для его стилизации

.newlinelink { white-space:pre;
}

licensed under cc by-sa 3.0 with attribution.