>

화면 크기 조정으로 인해 새 줄로 밀 때마다 텍스트를 들여 쓰려고합니다. 나는 그것을 잠시 동안 고민해 왔지만 display : block은 나를 위해 그것을하지 않는 것 같습니다. 누구나 새로운 줄마다 텍스트를 들여 쓰는 방법을 알고 있습니까?

다음 HTML 코드를 사용하고 있습니다 :

<ul class="sortable ui-sortable list-group">
    @foreach (UIBookmark b in Model.Bookmarks)
    {
        <li class="bookmark-card ui-sortable-handle" id="@b.Id">
            <form class="form-button" action="/Api/Bookmarks/@b.Id" method="DELETE">
            <a href="#" class="link-submit">
            <span class="ql glyphicon glyphicon-star" />
            </a>
            </form>
            <span>@Quick.LinkForLinkable(Html, b.Target)</span>
        <p class="text-muted revision-date">&#8195;&#8195;&#8195;<i class="glyphicon-glyphicon-chevron-right"></i>@b.Target.GetTypeDisplay()</p>
    </li>
    }
</ul>

  • 답변 # 1

    그중 몇 가지 방법이 있습니다 :

    td {
      border: blue solid 2px;
      max-width: 160px;
      vertical-align: top;
    }
    
    
    <table>
      <tbody>
        <tr>
          <td>★</td>
          <td>contract manufacturing companies</td>
        </tr>
      </tbody>
    </table>
    
    

    Flexbox

    .container {
      max-width: 180px;
      display: flex;
    }
    .container div {
      border: blue solid 2px;
    }
    
    
    <div class="container">
      <div>★</div>
      <div>contract manufacturing companies</div>
    </div>
    
    

  • 답변 # 2

    별 요소에 여백을 적용 할 수 있습니다. 도움이 될 것입니다

  • 답변 # 3

    의사 클래스 :before 를 사용하여 스타 이미지를 추가 할 수 있습니다  그리고 li 를  디스플레이 flex . 외부 용기는 구부릴 필요가 없습니다.

    .container {
      max-width: 180px;
    }
    .container li {
      list-style: none;
      color: #0095ff;
      display: flex;
    }
    .container li:before {
      content: "\2605";
    }
    label{  
      padding-left:5px;
    }
    
    
    <ul class="container">
      <li>
        <label>contract manufacturing companies</label>
      </li>
    </ul>
    
    

  • 이전 c# - asp-for의 사용자 정의 이름을 지정하십시오 (하위 특성 만 필요)
  • 다음 aws lambda - 오류 - 현재 슬롯 및 sessionattribute 세트가 주어지면 사용 가능한 메시지가 없습니다