У меня есть код, который окно печатает таблицу (отчет) и вывод выглядит следующим образом:Maximize Ширина печати CSS3
Мой код:
CSS
@media print {
body * {
visibility: hidden;
}
#reportArea, #reportArea * {
visibility: visible;
}
#reportArea {
position: absolute;
left: 0;
top: 0;
}
}
HTML (лезвие):
<button type="submit" class="btn btn-success hidden-print" onclick="window.print();">
<i class="fa fa-print"></i> Print
</button>
<div id="reportArea">
<div class="box-body table-responsive no-padding">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Room #</th>
<th>Invoice #</th>
<th>Client Name</th>
<th>Booked At</th>
<th>Reservation From</th>
<th>Reservation To</th>
<th>Amount</th>
</thead>
</tr>
<tbody>
@foreach($reservations as $res)
<tr>
<td>{{ $res -> room -> room_number }}</td>
<td></td>
<td>{{ $res -> client -> name }}</td>
<td>{{ date('F d, Y', strtotime($res -> created_at)) }}</td>
<td>{{ date('F d, Y', strtotime($res -> reservation_from)) }}</td>
<td>{{ date('F d, Y', strtotime($res -> reservation_to)) }}</td>
<td>{{ $res -> charge -> sum('price') }}</td>
</tr>
@endforeach
<tr>
<td colspan="2"><strong>Total:</strong></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><strong>{{ $total }}</strong></td>
</tr>
</tbody>
</table>
</div>
</div>
Что я могу сделать, чтобы максимально использовать бумагу? Как вы видите, в левой и правой частях есть большое пространство .. или есть лучший способ сделать это? Спасибо.
'ширина: 100%;'? – csmckelvey
Посмотрите на элемент и размер родителей родителей – sailens
@takendarkk, в какую часть следует добавить 100% ширину? – FewFlyBy