How to keep a <div> constant in size as the user zooms in and out on the page?

Question

Is there an html / css / javascipt way to maintain a <div> at a constant size in the face of the user's zooming the page in and out? That is, using control-plus to increase text size and control-minus to reduce it.

EDIT: The kicker, I guess, is that I want the content of the <div> to stay the same size, too.

Thanks!

EDIT: My goal was (and is) to keep an AdSense <div> from expanding so much as to obscure a lot of the real content on the page. But come to find out (thank you @thirtydot) there's really no good way to do this. The answer, for me (thank you @Neal!): give the <div> overflow:scroll so as to sacrifice its content rather than the content I'm trying to show.

Answer 1

.box {
    background: red;
    width: 5vw;
    height: 10vh;
    position: absolute;
    top: 10vh;
    left: 5vw;
}

<div class="box"></div>

Answer 2

There is no good way (read: reliable) to do this. Sorry.

What you're asking for basically boils down to detecting the zoom level of the browser, and there's a great answer here (confirming just how difficult this is):

• How to detect page zoom level in all modern browsers?

As stated in that answer, there is a "kinda" cross-browser crazy way involving the use of Flash, but there are downsides:

• It uses Flash.
• It's not reliable if the user loads your page already zoomed in.
• It uses Flash. Yes, this is so bad that I said it twice. Think of all those iPhones/iPads.

Anyway, it's here:
http://blog.sebastian-martens.de/2009/12/how-to-detect-the-browser-zoom-level-change-browser-zoo/