DASH plotly bootstrap hide div on print

Question

I'm using DASH app on Heroku that requires user to print out the page in PDF. I'm looking to 'save to pdf' option in the browser, however, a simple page print contains Div elements that are undesirable such as buttons. I'm using DASH BootStrap Components but I don't see any .d-print-none (Display in Print) options in their documentation. Is there a way I can hide div elements on printing? Apologies for the basic question.

Answer 1

You could give each item you want to hide a certain className, and then set up a stylesheet with something like this:

@media print {
  .print-class { 
    display: none;
  }
}

Answer 2

You can set the class_name property of your div to d-print-none:

html.Div("YOUR CONTENT HERE", class_name = "d-print-none")

https://getbootstrap.com/docs/4.0/utilities/display/