Tip of the day: Hide button on printing in web app

To hide a button when printing a web page made with REAL Studio Web Edition, you can use CSS like this.

First you have a webpage with a print button on it. Inside the button, you simply code

  ExecuteJavaScript "print();"

to print the page with the browser's print dialog.

Next you create a style in the project. We name it "PrintHiddenStyle" for this example. Assign this style to the button you want to hide. Now you can add a page source object to your web page. There you define this html/CSS style:

<STYLE type="text/css">
@media print 
{
.PrintHiddenStyle { display: none; }
}
</STYLE>

Simply paste this. Location for the page source is "header".
And that's it. If your browser does CSS correctly and the name of the style in CSS and the style in your project matches, the button is not visible for printing.

Download test project:

printtest.rbp.zip The biggest plugin in space...