HTML Print - PHP

4

Next ... I have an HTML structure formed by TABS, the style of these link: link However, when printing with Ctrl + p, it only calls the TAB that is Active. How do I print the contents of all TABS?

<div class="col-md-6">
    <div class="card">
        <div class="card-head">
            <ul class="nav nav-tabs" data-toggle="tabs">
                <li class="active"><a href="#first1">FIRST TAB</a></li>
                <li><a href="#second1">NO. TWO</a></li>
                <li><a href="#third1">THE THIRD</a></li>
            </ul>
        </div><!--end .card-head -->
    <div class="card-body tab-content">
        <div class="tab-pane active" id="first1">                        
           <p>Per at postea mediocritatem, vim numquam aliquid eu, in nam sale gubergren. Fuisset delicatissimi duo, qui ut animal noluisse erroribus. Ea eum veniam audire. Dicant vituperata consequuntur.</p>
        </div>
        <div class="tab-pane" id="second1">                     
           <p>Ad ius duis dissentiunt, an sit harum primis persecuti, adipisci tacimates mediocrem sit et. Id illud voluptaria omittantur qui, te affert nostro mel. Cu conceptam vituperata temporibus has.</p>
        </div>
        <div class="tab-pane" id="third1">                      
           <p>Duo semper accumsan ea, quidam convenire cum cu, oportere maiestatis incorrupte est eu. Soluta audiam timeam ius te, idque gubergren forensibus ad mel, persius urbanitas usu id. Civibus nostrum fabellas mea te, ne pri lucilius iudicabit. Ut cibo semper vituperatoribus vix, cum in error elitr. Vix molestiae intellegat omittantur an, nam cu modo ullum scriptorem.</p>
        <p>Quod option numquam vel in, et fuisset delicatissimi duo, qui ut animal noluisse erroribus. Ea eum veniam audire. Per at postea mediocritatem, vim numquam aliquid eu, in nam sale gubergren. Dicant vituperata consequuntur at sea, mazim commodo</p>
        </div>
    </div><!--end .card-body -->
</div><!--end .card -->

    
asked by anonymous 20.05.2015 / 19:57

1 answer

2

You can use a specific CSS rule for when you print, and force what is hidden with display: none; to be visible when it is to print.

In your HTML it would look something like this:

@media print {
    .tab-pane {
        display: block !important;
    }
}

You can put this code in your CSS file or HTML page like this:

<style>
@media print {
    .tab-pane {
        display: block !important;
    }
}
</style>
    
20.05.2015 / 20:01