PDA

View Full Version : Opera Mini rendering issue



chevy_ls_6
Dec 31st, 2010, 01:43 AM
I attached a screenshot from the Opera Mini simulator, but it looks exactly the same on my phone, as well as a couple of other browsers in the browser compatibility site (IE6).

For some reason, it's showing a huge break between my header div and body container div, as well as doubling one of the header images?

I don't know if too many folks are stuck browsing with Opera Mini like I am, but it's frustrating because everything else seems pretty close...any and all help appreciated!

Excavator
Dec 31st, 2010, 02:19 AM
Hello chevy_ls_6,
That url, if anyone was wishing they could help, is http://yenko.net/R4/

It doesn't look terrible on my HTC Desire, I mean it's a little broken up but it's totally useable.

When it's zoomed out to view the whole page:
The header and nav are at the top with no gap and no repeated image.
Contact Us breaks to the next line.
The yellow sidebar is one column, then #nav-menu and #events is a column...
then #content is acting like a dropped float.

Well, at least I'm not seeing the big gap you are.

When you zoom in to actually be able to read it or click on a menu item you can't tell where those things are supposed to lay anyway.

chevy_ls_6
Dec 31st, 2010, 02:57 AM
LOL, yeah it just dawned on me I forgot the url...doh!

Desire, my wife has had hers a couple of months, and raves about it (she came from a BB Bold)...I tote around an HTC Touch Pro 2. How do you like yours? I'm debating on making the jump to a Desire, or possibly a Galaxy class phone (Samsung Memerize).

The gap shows up in IE6 as well, so if I can figure out why it does it there I'm hoping I can nail down the issue in Mini as well...but I'm wondering if I'm not just chasing my tail, and should just create a seperate css dependant on screen size?

chevy_ls_6
Dec 31st, 2010, 07:15 PM
It's pulling the same stunt in IE6...looks to be roughly the same size as my header images (164px)...same bug breaking Opera Mini as IE6?

And I see it's jacking with my horizontal menu height (background) as well...?? Matter of fact, IE6 hates my page in general, lol!

chevy_ls_6
Dec 31st, 2010, 07:25 PM
Ok, a simple "float: left" on my rounded corner image fixed the gap...of course, now that image is gone!

Now let's see if I can't fix the horizontal nav.

chevy_ls_6
Dec 31st, 2010, 08:25 PM
In IE6, the header breaks, but it's at least in the correct spot and somewhat funtional...but on my phone, it looks like the header fill background is stretching it's height, and then the comet logo image is being rendered once in normal size and then again on top of it in the stretched version to fit the stretching header background?

chevy_ls_6
Jan 17th, 2011, 07:20 PM
Just as an update, the image issue was that I had some code leftover in my css with a background image in the same div with the header image, thus it was displaying both images...took out the background, and all is well.

But, Opera Mini is still doubling the *height* of the header div, for some reason...:confused:

chevy_ls_6
Jan 19th, 2011, 06:33 PM
Someone posted the solution over at the Opera.Dev site:

By andreasbovens Tuesday, 18. January 2011, 16:15:25

The height of the header div is correct in Mini, but the image size of the contained images has been downscaled. However, this is so by design. When Image Quality in the Settings is set to Low/Medium, the image size is somewhat reduced to save on bandwidth. If it's set to High, you'll see the image in its original size.