2
Je ne veux pas un saut de page à l'intérieur de l'élément td dans le support d'impression. (Il ne doit jamais briser même lorsque la page est agrandie ou dans l'aperçu avant impression)CSS ne pas saut de page à l'intérieur d'un élément td
<table class = "narr_tr">
<tr>
<td>
<span> Text 1 </span>
<span> Text 2 </span>
</td>
</tr>
.
.
</table>
Les éléments de portée ne seraient jamais plus de 2, il ne peut y avoir une travée bien.
page-break-inside ne fonctionnerait pas dans IE (moins de 8 ans), donc je ne peux utiliser que
J'ai essayé
.narr_tr tr td span { display: block; }
.narr_tr tr td span:first-child { page-break-after: avoid; }
.narr_tr tr td span:first-child + span { page-break-before: avoid; }
mais il ne fonctionne pas.
Existe-t-il une alternative à cela sans utiliser de saut de page? Est-ce que cela peut être fait dans JS en utilisant offsetHeight de l'élément? Si oui, comment obtenons-nous la hauteur lorsque la page est agrandie?
MISE À JOUR:
Voici le code réel
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>Untitled Page</title>
<style type="text/css" media="print">
.narr_table tr td span
{
display: block;
}
.narr_table tr td br
{
display: none;
}
.narr_table tr td span:first-child
{
color: Red;
page-break-after: avoid;
}
.narr_table tr td span:first-child + br + div
{
page-break-before: avoid;
color: Blue;
}
</style>
</head>
<body>
<table class="narr_table">
<tbody>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057943812" class="Bold">Additive C1sj</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057936097" class="Bold">aspirin</span>
<br>
<span id="MEDSIG5057936097">, 125 mg, twice daily</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057935161" class="Bold">aspirin</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046867" class="Bold">aspirin</span>
<br>
<span id="MEDSIG5058046867">325 mg, orally, Daily</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD189600670" class="Bold">aspirin</span>
<br>
<span id="MEDSIG189600670">600 mg, twice daily, As Needed, anxiety</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057940142" class="Bold">aspirin</span>
<br>
<span id="MEDSIG5057940142">1,300 mg, orally, twice daily</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD189877590" class="Bold">aspirin</span>
<br>
<span id="MEDSIG189877590">100 mg, orally, Four times per day, Refills: 0</span>
<br>
Ordering provider: Ragan , Carol
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057938523" class="Bold">Aspirin + Metoclopramide</span>
<br>
<span id="MEDSIG5057938523">, 01_SR_BID_0100_0600</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057940434" class="Bold">aspirin-caffeine</span>
<br>
<span id="MEDSIG5057940434">, orally, Every 6 Hours</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057937375" class="Bold">aspirin-codeine</span>
<br>
<span id="MEDSIG5057937375">1 tab(s), orally, Every 6 Hours, 2 day(s), As Needed, 1
reason</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057939839" class="Bold">aspirin-hydrocodone</span>
<br>
<span id="MEDSIG5057939839">1 tab(s), orally, Every 6 Hours, 5 day(s)</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057937319" class="Bold">aspirin-meprobamate</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057936841" class="Bold">aspirin-oxycodone</span>
<br>
<span id="MEDSIG5057936841">, orally, (not to exceed 12 tablets/day), 1 day(s), Refills:
0</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046894" class="Bold">aspirin-oxycodone</span>
<br>
<span id="MEDSIG5058046894">, orally, Refills: 0</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057943023" class="Bold">aspirin-oxycodone</span>
<br>
<span id="MEDSIG5057943023">, orally, Every 6 Hours, Refills: 0</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057937075" class="Bold">aspirin-pravastatin</span>
<br>
<span id="MEDSIG5057937075">, 125, 1ROUTE, 01RS_TID_0600_1000_1400_1800_2200</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057938046" class="Bold">aspirin-pravastatin</span>
<br>
<span id="MEDSIG5057938046">, As Needed, 3 reason, Refills: 0</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046897" class="Bold">Ca carbonate/Mg hydroxide/simethicone</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057943870" class="Bold">captopril-RTT</span>
<br>
<span id="MEDSIG5057943870">, orally, Refills: 0</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD190192586" class="Bold">Dextrose 5% in water 1,000 mL Every Bag</span>
<br>
<span id="MEDSIG190192586">1000 mL, 100 mL/hr, Intravenous</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5057943237" class="Bold">docusate (primary)</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046895" class="Bold">epinephrine-lidocaine</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD189571670" class="Bold">ibuprofen</span>
<br>
<span id="MEDSIG189571670">300 mg, Every 4 hours10</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046896" class="Bold">methotrexate</span>
<br>
<span id="MEDSIG5058046896">3 tab(s), orally</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD189801420" class="Bold">milk thistle</span>
<br>
<span id="MEDSIG189801420">20 dL, Anterior Chamber, Seven times a day</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD190192816" class="Bold">morphine 15 mL Every Bag + Dextrose 5% in water
1,000 mL Every Bag</span>
<br>
<span id="MEDSIG190192816">1000 mL, 100 mL/hr, Intravenous</span>
</td>
</tr>
<tr class="narr_tr">
<td>
<span id="MEDPROD5058046893" class="Bold">Paracetamol + Sodium salicylate</span>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Le texte rouge et le texte noir devrait aller ensemble dans tous les niveaux de zoom. Mais, il casse après le texte rouge. Faites-moi savoir si mon code est incorrect n'importe où.
Merci
Pourriez-vous donner un exemple visuel de ce que vous essayez d'atteindre et de prévenir? Merci. – hungerstar
@hungerstar Bien sûr. J'ai mis à jour la question avec l'instantané de l'erreur et le code réel. –