How to make the adaptive YAN block (RTB) adaptive?

Question

css

Hello! I can't find the answer to my question anywhere! The fact is that my site is made with adaptive layout, I need to install the YAN ad unit on the site so that it adapts to mobile devices: tablets, phones. But here's the problem, when I set the width and height in% in styles, as is done with adaptive design for blocks, the YAN block at point-blank range does not want to adjust and climbs out of the template. Yes, I know there are style codes like this:
media screen and (max-width: 800px) {
.yandex-adaptive {
width:200px;
height:300px;
}
}
media screen and (max-width: 1024px) {
.yandex-adaptive {
width:240px;
height:400px;
}
}
But they work differently than at 100%, that is, the block with a smaller screen also decreases in width, but when, for example, you rotate your phone or tablet in width, the blocks remain 240px, and the site stretches to 600-800px. As a result, a small block, a lot of empty space.
Tell me how to set up YAN blocks, as for example on this "Toaster" service. Thank you!

Answer 1

some kind of rsya, you would show the code better