Mpdf Kartik的Posisition Absolute无法正常工作
从问题Yii2 mPdf Kartik: Set Height and Width Paper继续
页面页脚上的宽度位置绝对有问题。
我已将其设置为position: absolute;和bottom: 0;
但是页面页脚不在实际位置。
职位应该是这样的：
这是我的html代码：
<?php
$pages = 1;
$pageof = 1;
$totalPageof = ceil(count($model->details) /10);
$index = 0;
?>
<?php if(count($details) > 0) : ?>
<div class="page-wrapper">
<?php foreach($details as $detail) :
$index += 1;
?>
<?php if($pages == 1) : ?>
<div class="page-layout">
<!-- HEADER -->
<div class="page-header">
<table class="table-header">
<tbody>
<tr>
<td class="font12" width="250"><strong>COMPANY NAME</strong></td>
<td class="font14" width="250"><strong>PROFORMA INVOICE</strong></td>
<td>
<table>
<tr>
<td class="font11" width="80">NO. PO</td>
<td class="font11" width="10">:</td>
<td class="font11"><?=$model->no_po?></td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="font11" width="250">
<p>COMPANY ADDRESS</p>
</td>
<td class="font14" width="250"><?=$model->no_rorder?></td>
<td>
<table>
<tr>
<td class="font10" width="80"><?=(!empty($model->tgl_po)) ? date('d-M-Y', strtotime($model->tgl_po)) : NULL ?></td>
<td class="font10"><?=(!empty($model->tgl_tempo)) ? 'DUE DATE '. date(' d-M-Y', strtotime($model->tgl_tempo)) : 'DUE DATE -' ?></td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="padding: 0;">
<table>
<tr>
<td class="font12" colspan="3">COMPANY PHONE</td>
</tr>
<tr>
<td class="font10" width="60">NPWP</td>
<td class="font10" width="10"></td>
<td class="font10"><?=isset($model->distributor) ? $model->distributor->npwp : '-' ?></td>
</tr>
<tr>
<td class="font10" width="60">SALESMAN</td>
<td class="font10" width="10">:</td>
<td class="font11"><?=isset($model->sales) ? (isset($model->sales->code)) ? $model->sales->code.'-'.$model->sales->name : $model->sales->name : '-' ?></td>
</tr>
<tr>
<td class="font10" width="60">NOTICE</td>
<td class="font10" width="10">:</td>
<td class="font10"><?=isset($model->salesType) ? $model->salesType->name : '-' ?></td>
</tr>
</table>
</td>
<td colspan="2">
<table>
<tbody>
<tr>
<td rowspan="2" class="font12 grid-1">Kepada YTH</td>
<td class="grid-2">
<p class="font12"><?=isset($model->outlet) ? $model->outlet_code.' - '.$model->outlet->name : '-' ?></p>
<p class="font12"><?=isset($model->outlet) ? $model->outlet->address : '-' ?></p>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td class="font10 text-left" style="padding-left:180px;" colspan="2">
<span>
Phone <?=isset($model->outlet) ? $model->outlet->phone_1 : '-' ?>
</span>
</td>
</tr>
<tr>
<td class="font10" width="200"><?=isset($model->outlet) ? $model->outlet->npwp : '-'?></td>
<td class="font10"><?='Page '. $pageof++ .' Of '. $totalPageof ?></td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
<!-- /HEADER -->
<?php endif; ?>
<!-- /endif pages header -->
<!-- CONTENT -->
<?php if($pages == 1) : ?>
<div class="page-content">
<table class="table-content">
<thead>
<tr>
<th>KODE#</th>
<th>PRODUK</th>
<th colspan="5">QUANTITY</th>
<th>PRICE</th>
<th>DISC</th>
<th>SUB TOTAL</th>
</tr>
</thead>
<tbody>
<?php endif; ?>
<!-- /endif pages content -->
<tr>
<td class="text-right"><?=(isset($detail['typeproduct'])) ? '*'. $detail['product_code'] : $detail['product_code']?></td>
<td><?=$detail['product_name']?></td>
<td><?=($detail['comp_1'] && $detail['zqty_1'] != 0) ? number_format($detail['zqty_1']).'.'.$detail['comp_1'] : ''?></td>
<td><?=($detail['comp_2'] && $detail['zqty_2'] != 0) ? number_format($detail['zqty_2']).'.'.$detail['comp_2'] : ''?></td>
<td><?=($detail['comp_3'] && $detail['zqty_3'] != 0) ? number_format($detail['zqty_3']).'.'.$detail['comp_3'] : ''?></td>
<td><?=($detail['comp_4'] && $detail['zqty_4'] != 0) ? number_format($detail['zqty_4']).'.'.$detail['comp_4'] : ''?></td>
<td><?=($detail['comp_5'] && $detail['zqty_5'] != 0) ? number_format($detail['zqty_5']).'.'.$detail['comp_5'] : ''?></td>
<td class="text-right"><?=(!is_null($detail['zsprice_1'])) ? number_format($detail['zsprice_1'], 0, ',', '.') : ''?></td>
<td class="text-right"></td>
<td class="text-right"><?=(!is_null($detail['zjum_j'])) ? number_format($detail['zjum_j'], 0, ',', '.') : ''?></td>
</tr>
<!-- COUNTER ITEM -->
<?php if($pages == 10 || $index == count($details)) : ?>
</tbody>
</table>
</div>
<!-- /CONTENT -->
<!-- FOOTER -->
<?php if($totalPageof == ($pageof-1)) : ?>
<div class="page-footer">
<table class="table-footer">
<tbody>
<tr>
<td class="grid-1">
<p class="font9"><?=(!empty($model->keterangan)) ? '<i>##</i>'. $model->keterangan : NULL ?></p>
</td>
<td class="grid-2 text-right" width="200">
<p class="font12"><strong><?=(!$model->post) ? '' : '### PENCETAKAN ULANG ##' ?></strong></p>
<table>
<tbody>
<tr>
<td class="font9" width="60">Cetakan ke</td>
<td class="font9">:</td>
<td class="font9 text-right"><?= (!empty($model->post)) ? $model->print : 0 ?></td>
<td></td>
<td class="font9" width="60">Sub Total</td>
<td class="font9">:</td>
<td class="font9 text-right"><?=number_format($realJumlah['total_j'], 0, ',', '.')?></td>
</tr>
<tr>
<td class="font9" width="60">Total Pcode</td>
<td class="font9">:</td>
<td class="font9 text-right"><?= count($details) ?></td>
<td></td>
<td class="font9" width="60">Disc Inv</td>
<td class="font9">:</td>
<td class="font9 text-right"><?=number_format($realJumlah['disc_percent'], 0, ',', '.')?></td>
</tr>
<tr>
<td class="font9" width="60">Point</td>
<td class="font9">:</td>
<td class="font9 text-right"><?=number_format($realJumlah['disc_point'], 0, ',', '.')?></td>
<td></td>
<td class="font9" width="60">DPP</td>
<td class="font9">:</td>
<td class="font9 text-right"><?=number_format($realJumlah['dpp'], 0, ',', '.')?></td>
</tr>
<tr>
<td colspan="4"></td>
<td class="font9" width="60">PPN</td>
<td class="font9">:</td>
<td class="font9 text-right"><?=number_format($realJumlah['ppn'], 0, ',', '.')?></td>
</tr>
<tr>
<td colspan="4"></td>
<td class="font10" width="60"><strong>TOTAL</strong></td>
<td class="font10">:</td>
<td class="font10 text-right"><strong><?=number_format($realJumlah['inv'], 0, ',', '.')?></strong></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="grid-1"></td>
<td class="grid-2 font10 money text-justify"><?=$realJumlah['terbilang']?></td>
</tr>
<tr>
<td class="grid-1">
<p class="font10">Admin SPV Gudang Pengirim Outlet</p>
<p class="font10">Produck yang sudah diterima harap diperiksa kembali</p>
<p class="color-white">----------------------------------------------------</p>
<p>----------------------------------------------------</p>
</td>
<td class="grid-2" style="padding-left: 80px;">
<table>
<tbody>
<tr>
<td class="font9">User</td>
<td class="font9">:</td>
<td class="font9"><?=Yii::$app->user->identity->profile->user->username?></td>
</tr>
<tr>
<td class="font9">Printed</td>
<td class="font9">:</td>
<td class="font9"><?= date('H:i:s', time()) ?></td>
</tr>
<tr>
<td class="font9">on</td>
<td class="font9">:</td>
<td class="font9"><?=date('d/m/Y')?></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
<?php endif; ?>
<!-- /FOOTER -->
<?php endif; ?>
<!-- /COUNTER ITEM -->
</div>
<?php
$pages++;
if($pages > 10)
$pages = 1;
endforeach;
?>
<!-- /endforeach -->
</div>
<?php endif; ?>
<!-- /endif count -->
这是我的CSS代码：
/** page layout */
.page-wrapper {
height: 13.6cm;
width: 21.2cm;
}
.page-layout {
height: 13.6cm;
width: 21.2cm;
}
.page-footer {
bottom: 0;
position: absolute;
}
/** end page layout */
/** table style */
.table-header {
width: 100%;
}
.table-header tbody tr td {
padding-bottom: 0;
padding-top: 0;
vertical-align: text-bottom;
}
.table-header tbody tr td p {
margin: 0;
}
.table-header tbody tr td table {
width: 100%;
}
.table-header tbody tr td table tbody tr td.grid-1 {
width: 20%;
}
.table-header tbody tr td table tbody tr td.grid-2 {
width: 80%;
}
.table-content {
font-family: 'Couriere';
width: 100%;
}
.table-content thead tr th {
border-bottom: 1px dashed #000;
font-size: 12px;
font-weight: 300;
text-align: center;
}
.table-content tbody tr td {
font-size: 12px;
padding-bottom: 0;
padding-top: 0;
}
.table-footer {
width: 100%;
}
.table-footer tbody tr td {
padding-bottom: 0;
padding-top: 0;
position: relative;
}
.table-footer tbody tr td p {
margin: 0;
}
.table-footer tbody tr td.grid-1 {
vertical-align: text-bottom;
width: 70%;
}
.table-footer tbody tr td.grid-2 {
width: 30%;
}
.table-footer tbody tr td.money {
padding-left: 40px;
}
.table-footer tbody tr td table {
width: 100%;
}
/** end table style */
/** custom child */
.font9 {
font-size: 9px;
}
.font10 {
font-size: 10px;
}
.font11 {
font-size: 11px;
}
.font12 {
font-size: 12px;
}
.font14 {
font-size: 14px;
}
.text-right {
text-align: right;
}
.text-justify {
text-align: justify;
}
.color-white {
color: #fff;
}
/** end custom child */
可能有人曾经经历过，希望可以对它有所帮助。
0 个答案:
没有答案
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？