dotMobimobiThinkingmobiForgemobiReadyDeviceAtlasgoMobi

Posted by Meanmachine 3 years 12 weeks ago

pic
 Meanmachine
mobiForge Enthusiast
Posts: 10
Joined: 3 years ago
[offline]

Has anyone had experience with Opera Mini? It seems that certain CSS styling that I thought should be supported is apparently not.

Case in point. I am having to design a page for our Blackberry devices running 4.1 OS, that support less than 10% of any html or css, and also for higher end mobile devices so that it looks presentable in both.

I found that using a <span> tag with either inline style color, <span style="color:#fff;">, or using a class with color option, <span class="color">, does not work. I had to resort to a <span> tag and use the visibility option, <span style="visibility:none;>. I have also found that any class with a color option is not supported in Opera Mini:

.color_supress {color: #fff;}

Has anyone else run into this issue?

Thanks,

Posted by ruadhan 3 years ago

pic
 ruadhan
dotMobi logo
Mobile Champion
Posts: 707
Joined: 5 years ago
[offline]

Yes, I've seen this before, and confirmed it's not just a blackberry thing.

Actually, I think this might be Opera Mini being quite smart. It's transcoding pages, and doesn't want to obscure anything by accident, so if you put white text on white background it will ignore it, but if you put white text on black (or whatever) background it will follow the CSS rule:

Try this:

  <body>
    <br />
    Some text
    <br />
    <span style="color:#fff">this is some white text on white background</span>
    <br />
    <span style="background-color:#000;color:#fff">this is some white text on black background</span>
  </body>

In Opera Mini you see the text in both cases, whereas if you load in a 'normal' browser you don't see the white on white.

Nifty!

Ruadhan O'Donoghue
dotMobi

Posted by wgregoire 3 years ago

pic
 wgregoire
mobiForge Newbie
Posts: 2
Joined: 3 years ago
[offline]

Hi,

I'm currently using Opera Mini...and, sadly, testing in on my Nokia 5310 which still have Opera Mini 3.
I'm lost almost all my hair...
- no way to align left img (but it seems it's because of Opera Mini engine)
- Background color only on the minimum height of the page
- text-align center dispatched to next elements

<p style="text-align:center">
blabla
</p>
<hr />

will result in the horizontal rule starting in the middle of the screen.

Using OperaMini 4 simulator, I don't have a problem.

I know Opera Mini gets your page, transcode it for 'better mobile' use but I don't find a document on what it does and so what it must be kept in mind when writing the initial page. Perhaps I didn't use the good keywords in google ;)
so if someone have an Opera Mini CSS guidelines, drop me the link !
I thought Opera was the better CSS compliant browser...I could say it's not true for Mini.