web-dev-qa-db-fra.com

Supprimer les espaces blancs lors de l'utilisation de display: none sur les éléments dans print.css

J'essaie de simplifier la vue d'impression pour un client en supprimant des images (et certains autres éléments). Cependant, cela laisse des espaces blancs énormes entre les autres éléments de la vue d'impression.

Quelqu'un a-t-il des idées sur la manière de réduire l'espace blanc entre les noms des orateurs, simplement pour le condenser? Le css actuel utilisé est:

@media print{
       .prog a{display:none;}
       #main img, .news {display:none;}
       .prog .span8 .row-fluid {margin-bottom:0;}
        #footer ul {display:none;}
}

La vue d'impression peut être trouvée [ici] [1] en cliquant sur le bouton Imprimer.

Ce n'est pas vraiment une option pour ajouter plus d'éléments dans le HTML car chaque locuteur/nom est contenu dans son propre article K2 puisqu'il s'agit d'une vue en liste.

Je serais heureux pour des suggestions? Cordialement D

joomla-3.xcss
1
Dtorr1981

Votre vue d’impression fonctionne bien, mais vous devez modifier votre contenu pour supprimer les <p> </p> et <h4> </h4> blocs.

Au lieu de ce format pour chaque intervenant:

<h4>
  Sasja Beslik
  <img src="/images/conference/speakers/Sasja_Beslik.jpg" alt="Sasja Beslik" />
</h4>
<h4>
  <em>
    <span class="cred">
      Head of Sustainable Finance - Nordea Wealth Management - Sweden
      <a href="[LINK]">Linkedin</a>
    </span>
  </em>
</h4>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

Essayez ceci ou quelque chose de similaire:

<h4 style="clear: both;">
  Sasja Beslik
  <img src="/images/conference/speakers/Sasja_Beslik.jpg" alt="Sasja Beslik" />
  <em>
    <span class="cred">
      Head of Sustainable Finance - Nordea Wealth Management - Sweden
      <a href="[LINK]">Linkedin</a>
    </span>
  </em>
</h4>
2
Neil Robertson