How to print some content in landscape and some in portrait using CSS @Media Query?

I have created a report sheet in my React project, simply its a detailed report with so many data, so this report have so many tables and need to print this report sheet in hard copy. Now what I want is I want to print some table in landscape format and some table in portrait format if I click the print button below.

I have adjusted the @media print query like this:

@media print {
  @page {
    counter-increment: page 1;
    margin: 0.5cm;
    size: A4 landscape;

    @bottom-left {
      content: counter(page) " / " counter(pages);
      display: none;
    }
  }
}

This is working fine, by default I can see the print in landscape which is fine. I have so many tables and reports means if I print the sheet there will be so many pages, hence I want some table to printed in portrait format.
How can I do that?

You need to sign in to view this answers