Как центрировать абсолютно позиционированные элементы в css для pdf

Я пытаюсь центрировать имена (#box2) и тему (#box1) поверх изображения.

<?php require_once('seminar_config.php'); ?>

<a href="print.certificate.php">Print</a>

<body>
<?php
$participants = $db->get_results("SELECT participant FROM tbl_participants WHERE state=1");
$topics = $db->get_results("SELECT topic FROM tbl_topics");
if(!empty($participants)){
?>
<?php ob_start(); ?>
<div id="container">
<img src="certificate.jpg"/>
<?php foreach($topics as $a=>$b){ ?>
<?php foreach($participants as $k=>$v){ ?>
    <img src="certificate.jpg"/>
    <div id="box1" class="common"><?php echo $b->topic; ?></div>
    <div id="box2" class="common"><?php echo $v->participant; ?></div>
<?php } ?>
<?php } ?>  
</div>
<?php $_SESSION['certificates'] = ob_get_contents(); ?>
<?php ob_flush(); ?>    
<?php } ?>
</body>

А вот скрипт, который создает pdf:

<?php require_once('html2pdf/html2pdf.class.php'); ?>
<?php
$html2pdf = new HTML2PDF('L', 'A4', 'en');
$html2pdf->writeHTML('<style>

    #box1{  
        margin-top: 350px;
    }

    #box2{  
        margin-top: 200px;
    }

    .common{
        height: 20px;
        left: 630px;
        right: 630px;
        text-align: center;
        position: absolute;
        left: 0;
        top: 0;
        font-size:20px;
    }
</style>'.

$_SESSION['certificates']);
$html2pdf->Output('random.pdf');
?>

У меня нет проблем с центральным расположением имен и темы, если я не использую html2pdf для создания файлов PDF. Но если я использую html2pdf, все испорчено. Пожалуйста, помогите мне центрировать вещи в css при использовании html2pdf.


php html css html2pdf
person user225269    schedule 03.01.2012    source источник

Ответы (5)


arrow_upward
1
arrow_downward

Вот что я использую для позиционирования div по центру.

Скажем, вы хотите расположить div с id=test

CSS

#test {
   width: 500px;
   margin: 0 auto; //auto margin to left and right
}
person Ilja    schedule 03.01.2012

arrow_upward
2
arrow_downward

Большинство распространенных программ HTML-to-PDF либо не понимают CSS, либо плохо понимают CSS. Если ваш HTML работает, но плохо переводится в PDF с помощью html2pdf, вы можете попробовать wkhtmltopdf https://github.com/antialize/wkhtmltopdf

person mat    schedule 03.01.2012

arrow_upward
2
arrow_downward

Если вы хотите центрировать .common, попробуйте следующее:

    .common{
       position: absolute;
       left: 50%;
       top: 0;
       font-size:20px;
       width:600px;
       margin-left:-300px;
    }
person JorisW    schedule 03.01.2012

arrow_upward
2
arrow_downward

Старый вопрос, но у меня была аналогичная проблема сегодня. Вот как я смог решить эту проблему, попробовав каждый метод в истории html и css, чтобы что-то центрировать. Я использовал такую ​​таблицу, как JorisW:

<table style='width:100%' align='center'>
    <tr>
        <td>
            <img src="image.gif">
        </td>
    </tr>
</table>
person TheBlueAssasin    schedule 21.07.2014

arrow_upward
1
arrow_downward

Попробуйте использовать таблицы и встроенные стили CSS

<table align="left" width="100%" style="page-break-after:always; margin-top:25px; margin-left:25px; font-family:tahoma; font-size:20px; ">
<tr><td>Your info</td></tr>
</table>
person JorisW    schedule 03.01.2012