: How to prevent table borders from disappearing while printing? I'm just working at a website that is supposed to be printable. One problem I'm running into is that some table borders won't be

@Sherry384

Have you specified a print stylesheet, or a print @media section inside your existing stylesheet?

By default a stylesheet will work on-screen fine (as you've have discovered); However unless you explicitly specify a print CSS Stylesheet, when printing the page out, it will default to the browsers default styling (usually 15pt Times New Roman etc.).

Solution 1: Add a second, print stylesheet
Include both tags below in your HTML head:

<link rel="stylesheet" type="text/css" href="screenstyles.css" media="screen" /> <link rel="stylesheet" type="text/css" href="printstyles.css" media="print" />


Then copy the required formatting styles from screenstyles.css to printstyles.css (or just make both 's link to your screen stylesheet).

Solution 2: Only 1 stylesheet, but has print @media in it
Your single CSS stylesheet would like like this (omit the media="" from your css link rel tag

Vote Up Vote Down

@Cody1181609

Consider creating a style sheet for print media which utilizes the table's border property instead of cell spacing and background color - the following should generate a visible border when printing:

table {
border:solid #000 !important;
border-width:1px 0 0 1px !important;
}
th, td {
border:solid #000 !important;
border-width:0 1px 1px 0 !important;
}

Vote Up Vote Down