Обтекание текстом не работает на ярлыке внутри оболочки - CSS - PullRequest
Новая
       10

Обтекание текстом не работает на ярлыке внутри оболочки - CSS

0 голосов
/ 02 мая 2020

У меня есть несколько элементов прокрутки, которые настроены на CSS. Все работает нормально, но в следующем коде мне нужно, чтобы lblStallMessage1 имел максимальную ширину 200 пикселей, чтобы текст по этой ширине был перенесен на следующую строку. Я попытался добавить .. 

word-break: break-word; max-width:200px;

к <p>, который окружает элемент управления Label. Я также попробовал это в самом элементе управления метками, но ничего не меняется. 

<div class="wrapper">
    <section class="horizontal-scroll">
        <div class="item" id="item1" runat="server"><asp:HyperLink ID="hypStall1" runat="server" ><asp:Image ID="imgStall1" width="260px" ImageUrl="~/files/images/car1.gif" runat="server" /></asp:HyperLink><asp:HyperLink ID="hypStall1Avatar" runat="server" ><asp:Image ID="imgStall1Avatar" style="position:relative; float:left; margin-top:-70px; margin-right:-70px;" width="100px" runat="server" /></asp:HyperLink><p style="margin-right:0px;"><asp:Label ID="lblName1" runat="server" Text="" ></asp:Label></p><p style="position:relative; float:left; margin-top:-340px; margin-right:-70px;" width="100px"><asp:Label ID="lblStallMessage1" runat="server" Text="" ></asp:Label></p></div>
    </section>
</div>

Вот CSS .. 

.wrapper {
    width: 100%;
    margin: auto;
    border: 1px solid #333;
    background-image:url(images/field.jpg);
    background-repeat:no-repeat;
 }
.horizontal-scroll {
     overflow: hidden;
     overflow-x: scroll;
     overflow-y: hidden;
     white-space: nowrap;
     padding: 0px 0;
     height:380px;
 }
.item {
     border: 0px solid #333;
     display: inline-block;
     width: 260px;
     text-align: center;
     padding: 20px 0px;
     font-size: 20px;
     margin-left: 50px;
     margin-bottom: 60px;
 }
...