CSS hack for Opera Mini only

Question

Opera Mini doesn't support line-height and font-size correctly and I have 2 blocks of text (10px/1 Arial) — one at the top and one at the bottom of the page, both should be always visible (no scrolling or moving them allowed) but as they take much more space in Opera Mini I've got to downsize and remove some other blocks so there wouldn't be any scrolling (it's critical on mobile devices with small screens like 320x480px).

I know about JS solution that work perfectly, but I'm not allowed to use any scripts on that page. I can't use any not-standard font either. I'm only allowed to used the internal style sheet.

I couldn't find anything better than :-o-prefocus and I use it along with @media's so it would affect only mobile devices with small screens where the text takes much space, but this way it still affects all Operas on those devices so other blocks are unnecessary small or being removed there.

So basically, the question is — is there any pure CSS solution targeting Opera Mini only?

Update:

Eventually, the best non-js solution for the original problem I ended up with was:

:-o-prefocus, .block1, .block2 {font-size: 14px;}
@-o-viewport {zoom: 0.75;}

Meshach

Can you please tell js solution? – Frequentation

It's github.com/sureshdsk/browser-specific-css Using that script you can write browser-specific css rules, particularly for Opera Mini they should start with .operamini, like say body {background: #000} .operamini body {background: #f00} – Meshach

You should post your own solution as answer and accept it. – Vassily

In case someone is willing to use a JS-based hack for Opera Mini, there are two of them known so far: Object.prototype.toString.call(window.operamini) === '[object OperaMini]' and (navigator.userAgent.indexOf('Opera Mini') > -1). Sources: - browserhacks.com/#hack-172f62993dedb4837377cf1c6ac9dea9 - browserhacks.com/#hack-70b623e6ee3d3af7c3ca68b71c5fb29f – Aerobatics

Answer 1

Eventually, the best non-js solution was:

:-o-prefocus, .block1, .block2 {font-size: 14px;}
@-o-viewport {zoom: 0.75;}

Scourings

As this was confirmed as the answer that works, could someone please accept this? :) – Scourings