html - vez - twitter registrarse

Convertir la página de inicio de Twitter en PDF con wkhtmltopdf: problema de tramo

Question

Estoy usando KnpSnappyBundle Bundle KnpSnappyBundle para convertir una plantilla html KnpSnappyBundle a un pdf.

KnpSnappyBundle se basa en el envoltorio Snappy , que usa wkhtmltopdf .

Mi plantilla usa twitter bootstrap 2.3.2 css como este:

<div class="container">
    <div class="row">
        <div class="span12">
            <h4>TITLE</h4>
        </div>
    </div>
    <div class="row">
        <div class="span6" id="customers">
            <h5>TITLE</h5>

            <p>TEXT</p>

            <ul class="unstyled">
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
            </ul>
        </div>
        <div class="span6" id="estimate">
            <h5>TITLE</h5>

            <ul class="unstyled">
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
                <li>LIST ITEM</li>
            </ul>
        </div>
    </div>
</div>

Problema: los clientes y los intervalos de estimación no están en la misma línea que deberían. No sé que está pasando.

Answer 1

Aquí está la solución para Bootstrap3: Use .col-xs-n siempre.

La razón es que wkhtmltopdf no soporta css en el bloque @media. En bootstrap3, solo col-xs-n gobierna fuera del bloque @media.

He revisado el bootstrap2.3.2 css, parece que las reglas de spanN siempre están dentro del bloque @media.

Entonces, una solución fea se copiaría todas las reglas de spanN en el nivel superior a otro archivo css y se incluiría en html.

Answer 2

Si solo está intentando crear un PDF de una página web alojada, puede hacerlo de forma gratuita utilizando Internet Explorer.

He tenido que hacer esto para algunos clientes que requieren ver su página web y diseños de correos electrónicos en formato PDF para aprobaciones.

1. Abra la página web en Internet Explorer.
2. Pulsa F12 en tu teclado y se abrirán las herramientas de inspección.
3. Elija el ícono para ''Emulación'' , es un ícono de computadora / teléfono. Esto le permite seleccionar la versión de IE en la que desea emular su página. Elijo IE8 para obtener páginas y correos electrónicos receptivos para que se procesen como lo harían en una vista de escritorio completa.
4. Luego, en la esquina superior derecha de su navegador debe aparecer un ícono (tierra con un pequeño documento PDF al lado), haga clic en ese menú desplegable y seleccione ''Convertir página web a PDF''

Esto debería crear automáticamente un PDF de su página web con la mayor precisión posible, incluso con CSS sensible.