UL旁边的CSS

Question

我希望我的response = await client.GetStringAsync(uri); dynamic data = JObject.Parse(response); currPlaying = data.data[0][0].title + " - " + data.data[0][0].artist; 彼此相邻，我试图放ul但没有运气。有人可以帮我这个吗？

display:inline-block

CSS

@foreach($_employee as $key => $employee)
            <table>
                  <tr>
                    <th width="14%">EMP NO<br>{{ $employee->payroll_employee_number }}</th>
                    <th width="44%">EMPLOYEE NAME<br>{{ $employee->payroll_employee_last_name }}, {{ $employee->payroll_employee_first_name }} {{ $employee->payroll_employee_middle_name }}</th>
                    <th width="30%">PAY PERIOD<br>{{ $show_period_start }} - {{ $show_period_end }}</th>
                    <th width="12%">PAYROLL DATE<br>@if($show_release_date != 'not specified') {{ $show_release_date }}
                        @endif</th>
                  </tr>
            </table>

 //here's the ul
     <ul>
      <li>BASIC PAY : &nbsp; {{ payroll_currency($employee->net_basic_pay) }}</li>
      @foreach($employee->cutoff_breakdown->_gross_pay_breakdown as $breakdown)
          <li>{{ strtoupper($breakdown["label"]) }} : &nbsp; {{ payroll_currency($breakdown["amount"]) }}</li>
      @endforeach
    </ul>

    <ul>
      <li>GROSS SALARY : &nbsp; {{ payroll_currency($employee->gross_pay) }}</li>
    </ul>
@endforeach

Answer 1

您目前在同一父级下拥有UL和表。通过将UL包装在div中来分离它们，它们应该按预期工作。

@foreach(...)
   <table>
      ...
   </table>
   <div class="list-wraper"> <!-- Separator -->
       <ul>
          ...
       </ul>
       <ul>
          ...
       </ul>
   </div>
@foreach

您可以使用display：inline-block;

来使用相同的UL css

ul{
  margin: 0;
  display: inline-block;
  vertical-align:top; /** We need that too */
}