JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div>
<div id='sidebar' class="hidden-print">
  123
</div>
<div id='main-container'>
  456
</div>
<button id='print' class="hidden-print" onclick='window.print()'>Print</button>
</div>
</body>

CSS

#sidebar {
    width: 200px!important;
    opacity: 1;
    position: fixed;
    border: 3px solid;
}
#main-container {
    margin-left: 200px!important;
    border: 3px solid;
}
@media print{
.hidden-print,
tr.hidden-print,
th.hidden-print,
td.hidden-print{display:none !important;},
#main-container {
    margin-left: 0px!important;
    border:1px solid;
    border: 3px solid;
}
#main-container {
    margin-left: 0px!important;
}
}