My site exerciserx.net seems fine on Chrome/Mozilla but on I.E. 8 and lower its yucky (I know you have probably heard this before) but on I.E. 9 the navigation is completely dark on hover...I put all the necessary css (hoping..) but is there a way to get the site to look the same (or close to) on the other browsers? Thanks a bunch!
What you may need is PIE (http://css3pie.com/) It has a lot of cool fixes for older versions of IE but be warned it may slow down your site in those browsers if too many styles are used.
Related
I'm using EWW Emacs browser for opening various remote pages(mostly documentation) which is very handy most of the time.
I'm still trying to understand why certain pages take 4-5-6+ seconds to be rendered in eww(which take <1s in Chrome, for comparison).
For my tasks, I only care about the loaded content - images and fancy styles are not needed.
Is there any simple way to speed it up?
Like setting readable mode/disabling images before calling eww? If that's possible at all.
Update from a few weeks later
I made a few experiments and from what I found the biggest contributing factor in my case is when a page has lots of third-party fonts.
I wasn't able to find a way to disable font fetching in eww source code so probably true "text based" browser like w3m was a better solution in the first place.
Any clarification comments and answers are still very welcome.
I have a problem regarding fixed positioning that works on desktop(as expected), but doesn't work in any of the responsive testing tools in which i tested.
The site in question is this one: http://www.claytoncheung.com/
The problem is with menu div, it is set to position:fixed. Please don't ask why it is not set to absolute, i will only say that it can only be set to position:fixed. The reason is the limitations of the CMS that i use, i lost two days on various jQuery solutions to insert the menu dynamicaly, but unfortunately due to limitations in CMS none of these solutions worked.
The problem is that it is a multi language site, and the menu is not an ordinary one, since it is a one page site, so i am left with position fixed.
I tested the site in these tools:
http://www.responsinator.com/
http://mattkersley.com/responsive/
http://iphonetester.com/ and many more, but in all of them the menu doesn't take fixed position relative to the viewport, but to the parent element.
Please if anyone would take a look at the site to see how it should be and then try some of these tools to see the problem, or even better to check live on iPhone, which unfortunately i can't do.
If anyone could close this question, the problem was with my media queries, not with position fixed. After two days it just came to mind this moment.
Please forgive me if this answer is somewhere else on this site or online. If it is, I sure haven't found it in the past several days of searching.
What I am hoping to find is an "accurate" method of detecting a browser and redirecting to a simple, static page if not a recent browser.
The samples I have found until now often have not provided an accurate representation of the actual browser being used. For instance:
When testing with Navigator 9, I'll get a message that I'm using Firefox 2
When testing with Maxthon 3, it reports I'm using IE 9.
My site displays correctly in all the current browsers I've been testing it with. But I wish I could have a basic static page for those .01% who still are using an old browser for whatever reason. They could still get some basic information from my site, as well as encouraged to update to a more current browser.
If anyone has any useful suggestions, I'd greatly appreciate them.
Thanks so much.
Cheers,
David
Browser detection is never perfect, for a variery of reasons. If you are using jQuery, you should look into jQuery.browser.
I'd try to detect the browser on the server side and do an HTTP redirect if the browser is something non-standard. Most decent frameworks have functionality to detect the browser from the user agent string. Again, this is not perfect, mainly because of the data browsers report. Also, if Maxthon reports it's IE, that's because it is based on IE and therefore the layout engine should be the same.
So you either
support a small number of browsers and cater for their quirks, sending all other browsers to a basic page (this sucks for future versions of browsers because they might be standards-compliant but they will still display your very basic page), or
you have a standards-compliant page for all browsers and then you define alternatives for the ones that give you problems.
I'd go for the second option. It usually all boils down to one version for all browsers, and a number of hacks for various versions of IE. Also, remember to avoid padding in your CSS and use margins instead.
In the end, you probably shouldn't be testing for browsers and version numbers, but supported features. Try using Modernizr.
The $.browser property is deprecated in jQuery 1.3. On jQuery support site, they strongly recommend to use the detection feature (JQuery.support) instead of the jQuery.browser property.
Actually, this has been answered already in another question, please check here How can you detect the version of a browser?
I'm about to make a facebook application and I'm confused about what width I can design for. It seems that at the moment you have 760px at your disposal, but a lot of sources say this will be reduced to 520px in the beginning of 2010. Being halfway through 2010 already, I'm wondering if this is really happening? 520px seems very little? Does anyone know if and when the change will happen? What will happen to existing applications that are wider?
The 520px width is in reference the Application-Specific Tabs, not Applications proper.
Applications still use the full 760px width.
I've no idea what they intend, so take this with a pinch of salt. (Similarly, treat any assertions by non-Facebook staff with a heavy amount of cynicism - those crazy Zuckerbergites work in strange ways...)
Anyway, the last time they introduced a new width, they gave developers the option to stick with the old width system.
In fact, that option is still there (in the app settings):
Given that that option is still there, I'd cautiously suggest that:
They're not realistically planning another change any time soon.
If they do, they won't force it on developers
Hope this helps.
Update: Please disregard, my problem was caused by an advertisement bar being inserted by the vendor who provides my workplace wireless service.
I was building a mobile friendly website and wanted to use HTML 5. However when I specify the doctype as <!DOCTYPE HTML> , I get a gap at the top of the page on safari on the iphone.
I notice that other sites have the same problem such as nextstop.com and nike.com
I guess safari does not fully support HTML 5 yet. Anybody know of a workaround?
HTML 5 is still in a very unstable state. Don't use it in a production environment.
Edit Just so you guys know what it's about, HTML 5 is currently an Editor's Draft, and the document clearly states (in the Status of This Document section) that this specification is not stable, and that a consensus may not have been reached on any of the proposed sections. I think it should be clear enough that it means it's a bit early to start using it.
All browsers correctly interpret the HTML doctype. Putting it in sets your browser into Standards Compliant mode, that is the only difference with or without the doctype.
You can use a CSS reset tool like http://meyerweb.com/eric/tools/css/reset/ to get rid of default margins and padding on all elements.