# Print Helper Classes
# Margins / Paddings / Spacings
See general Spacing Documentation. Just add the prefix .print-
to the helper classes.
Examples:
// resets all vertical margins _only_ for print
.print-m-y-reset
1
2
2
// xxl-padding on the right _only_ for print
.print-p-r-xxl
1
2
2
# Display Helper Classes
// Print Helper Classes
.print-hide,
.hidden-print {
display: none !important;
}
.print-inline {
display: inline !important;
}
.pdf-display,
.print-block {
display: block !important;
}
.print-block-inline {
display: inline-block !important;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# Color Helper Classes
.print-no-bg {
background: none !important;
}
.print-color-black,
.print-black {
color: $black !important;
}
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# Border Helper Classes
.print-no-border
.print-border-top
.print-border-bottom
1
2
3
4
5
2
3
4
5
# Avoid Page Break
// avoid page break with the block
.print-no-page-break {
@include page-break();
}
1
2
3
4
5
2
3
4
5
# Table Print-Helper Classes
Add a bottom-border to table rows (horizontal border): add .print-row-border
to .c-table
or .c-table > tr
hide code
<div class="c-table print-row-border">
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </td>
</tr>
</div>
Add a bottom-right to table columns (vertical border): .print-col-border
hide code
<div class="c-table print-col-border">
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </td>
</tr>
</div>