otsukare Thoughts after a day of work

Full Screen Mode and CSS

These last two days, I forced myself to use Opera in Full Screen mode. I want to get a precise idea of what is accessible or not when the browser chrome is not visible. I wondered then what would it mean to have a different layout if Full Screen is activated. But was that even possible?

Fortunately CSS has a specification called View Mode. It was mainly done for handling widgets or Web apps if you prefer that name. But would that work in the desktop browser?

I tried the following code in a very simple HTML page and… it worked!

.fullscreen {display: none;}

@media screen and (view-mode: fullscreen) {
    .fullscreen {
        text-align:center;
        width: 5em;
        font-size: 3em;
        margin: 1em;
        padding: 2em;
        background-color: #F9C;
        display:block;}
}

It works on Mac OS X with Opera 11.50\ It doesn't work on Safari 5 and Firefox 6