website overlapping content on Opera

I've been having a problem that's been driving me nuts. I use Opera web browser (I don't like Firefox/IE) on main computer, and it usually works great. However, occasionally I will come across a site that will load with overlapping content pushed all the way to the left of the screen. For instance, a picture or embedded video will have text overlapping it, and if there are any sidebars/column ads, they will over/underlap those.

I do use a widescreen monitor, but the pages in question display perfectly on IE. Also, the pages display fine in opera on my laptop and in opera on my girlfriend's widescreen laptop.

Two websites do this all the time for me on my main computer:
http://www.kotaku.com/
http://www.lifehacker.com/

Any ideas how to fix this?
LVL 2
lake59Asked:
Who is Participating?
 
b0lsc0ttIT ManagerCommented:
Thanks for the images.  They helped to show the problem.

I believe I mentioned it earlier but the resolution itself should not affect this.  I am not surprised your tests showed this but I am glad you tried to duplicate the setup on your girlfriend's computer.  With everything else eliminated and the fact that it appears OK on her computer in Opera then it probably should work on yours too.  The last thing to try would to uninstall and reinstall Opera.  I didn't see that you said you had tried that.  I understand that fixing this may not be worth that step but that is the next thing to try.

About your comment on "Opera's style sheet" and CSS's meaning, it would take a whole new question (and probably more than one) to really explain this.  Basically though CSS is just an abreviation for a style sheet (i.e. another "name").  Browsers don't have style sheets.  However browsers are made to use and interpret them to render (i.e. show) the web page.  Just like html and even javascript there is a chance that different browsers or even versions interpret the style differently.  There are also some styles that aren't supported by certain browsers.  Just like many other things (e.g. html) there are "specs" or standards that browser makers, etc agree to follow and use.  CSS (aka style sheet) code or files are used by web designers for layout, formatting, etc.  Everything from font family, colors, widths, and even positioning is done with style sheets on web pages today.

The issue you see is basically different web page "elements" (i.e. html blocks) being positioned wrong in your browser.  When the browser displays it correctly then CSS shows the content and html elements just as the web designer wanted.  I can't tell you exactly the style rule that is causing the problem but since it doesn't seem to be an Opera compatibility issue it would be pointless to try to hunt it down.

I hope this explanation and info helps.  Let me know if you have a question.  Thanks again for all of the testing and info.

bol
0
 
thirdCommented:
you cannot fix it yourself. you have to inform each of the web developer/owner of the site about the problem and hope they will fix it.

your other option is, use FF/IE. I prefer FF. :)
0
 
b0lsc0ttIT ManagerCommented:
Does your Opera browser have a plugin or addon that your girlfriend's computer and Opera doesn't have?  Are the versions and updates the same?  Are you comparing the same size of browser window?

I don't have Opera but it sounds like it might not just be Opera.  I know you said you don't like the other browsers but do you have Firefox on your computer.  If so how does the page look in that browser?  It would be worth testing this by installing Firefox on your computer if you don't have it.  If the cause isn't the browser itself or an addon/plugin then it might be some other program, etc on your computer.

Let me know if you have a question or need more info.

bol
0
Cloud Class® Course: Microsoft Office 2010

This course will introduce you to the interfaces and features of Microsoft Office 2010 Word, Excel, PowerPoint, Outlook, and Access. You will learn about the features that are shared between all products in the Office suite, as well as the new features that are product specific.

 
lake59Author Commented:
The page looks fine in firefox/IE on the same computer opera has trouble with. All three computers have gone through the same recent versions of opera at one point or other, though not nessecarily at the same time. The results have consistently been the same. For a short while (a day or two), about a month ago, the two aforementioned pages showed up perfectly in opera on my main computer. I didn't do anything different, didn't install a new version or any software/plug-in that I could imagine would interefere with opera in any way.

My assumption has been that the problem has something to do with resolution support that a particular page offers, and for whatever reason, opera doesn't pick up on it, while firefox/IE does.

Also, I did just recently notice that both websites  happen to belong to Gawker Media, although other sites Gawker Media sites using the same format display fine.

And again, I'm not looking to switch to firefox. If I wanted to completely dodge the problem by switching browsers, I would. From what I've experienced, Opera is much more configurable and secure than firefox/IE, and I have it set up in a way I've been unable to duplicate in firefox.
0
 
b0lsc0ttIT ManagerCommented:
I am not trying to pressure you to change browsers.  It was just for testing.  I respect that you prefer it and that is fine.

Is the resolution different on your computer and your girlfriend's?  Is the browser window size different?  Does the problem persist in a smaller window or when maximized?

What about widgets, etc?  One of those could be causing this just like an extension in Firefox or addon in IE.

Resolution itself usually isn't going to cause an issue.  If it did then it should be reproducible on other computers (i.e. same resolution, browser, site).  The browser size itself is more likely to cause a problem because of style, etc.  The overlap you described can be caused by browser window size and CSS but that is almost always reproducible.

Just keep in mind that what Third said about the "fix" being on the site owner's side is true.  Of course the fact that this works on other Opera browser on a different computer gives hope but if there is a widget, etc that we identify as the cause the fix would have to be removing it.  Otherwise you just have to live with it (with maybe an email of the "bug" to the developer).

Let me know how this helps or if you have a question.

bol
0
 
lake59Author Commented:
I did test it on firefox, and the problem did not exist in that browser. I tried to change the resolution of my girlfriend's widescreen laptop, but the graphics card resolution maxes out at 1280x800.

Interestingly enough, I tried setting my resolution lower until I got to 800x600 and the problem persisted through all resolutions.

I did have two widgets installed, but I removed them with no effect.

So at this point, it looks to be browser AND machine specific, but NOT related to display resolution. Any other ideas? My newest theory is that it has something to do with Opera's "style sheet", though I have heard that problems with CSS (I confess, I don't really understand what that is) can result in weird effects too.

I took some screencaps to show exactly what the problem is:
<a href="http://photobucket.com" target="_blank"><img src="http://img.photobucket.com/albums/v508/monkeyagent/kotakuprob.png" border="0" alt="Photo Sharing and Video Hosting at Photobucket"></a>
<a href="http://photobucket.com" target="_blank"><img src="http://img.photobucket.com/albums/v508/monkeyagent/lifehackerprob.png" border="0" alt="Photo Sharing and Video Hosting at Photobucket"></a>
0
 
lake59Author Commented:
Also, the browser size doesn't affect the problem - while the text will adjust if I make the window too thin, it is all still overlapping, and left-justified.
0
 
lake59Author Commented:
I've tried reinstalling to no effect. If you think of any other ideas, I'd appreciate them, but it looks like we've hit a dead end. I appreciate the consistent help, and am awarding you the points.
0
 
b0lsc0ttIT ManagerCommented:
Thanks.  I have no other ideas but I'm glad the information has been useful.  Thanks for the fun question and points.

bol
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.