Problem with FireFox formatting Links with VBScript - css

For all those out there that claim FireFox to be the superior browser, why can't FireFox properly format a link when a vbscript is contained in the HREF?
Example:
<A HREF="<% =DEF_ROOT %>Products/category.asp?ID=1" CLASS="normal_link">
This link will not apply the formatting specified by the class until it has been clicked on at least once, however, the hover formatting will work. It seems as FireFox can't tell it is a link until the user actually clicks it. This is not a problem in IE.
If anyone knows a solution, I'd very much appreciate it.

Because Internet Explorer is the only browser that supports it.

Related

Firefox is not rendering CSS background (Firefox error/bug?)

After spending a while creating an online portfolio, then uploading it, I noticed an issue with one of my sections. On the "Advertisement" section, I noticed it was not displaying the information, just the title. So, I kept on re-pushing the stylesheet.css, even editing it, and it would still look the same. The HTML, CSS, and JS is working how I wrote it. But it is just the section that is not showing. After browsing online and on stackoverflow for an answer, I believe it has to do with Firefox. When using Firebug, I noticed the section's background has been removed, causing the entire section to "disappear." It works just fine on Chrome. I'm not worried about IE, I know that browser has some issues in itself. Anyway, would anyone on here have an idea to resolve this issue, if I can? Or even, what could be causing this issue?
Here is my website to see for yourselves. www.voelkerdesigner.com
Cheers!
It is the opposite for me your entire site works in firefox for me but not in chrome, looking through your code, its being caused by your naming conventions. Namely #advertise
I use the adguard extension in chrome and below is the css it plugs into my html pages to hide ads, so im guessing your using an adblocker in firefox
#adsense_top, #adsensewide, #adspace, #adspace_top, #adspot-300x250-pos-1, #adspot-300x250-pos-2, #adswidget1-quick-adsense, #adswidget2-quick-adsense, #adtext, #adtop, #adv-masthead, #adv-top, #advert1, #advert2, #advertbox3, #advertise, #advertisement1, #advertisetop, #advertising-container, #advertising_wrapper {
display: none!important;
}
Might as well post a random answer on this... As i wont visit posted links by new users.. i'm just gonna guess that your background image might not be 100%...
In general i use background-image instead of background.. Short hand can be a little pain and breaks in some browsers if not perfect.
so i would compare against the following example
background-image:url('images/mybg.jpg');
background-image:url('http://somesite.com/images/mybg.jpg');
Basically alot of people do not use the url and just go straight for a file name or dont quote it.. And have seen that be the problem in the past, so do use the url('') method.
Otherwise if it still fails to work and you know the image is absolute, you would then have some other css that is either over riding your elements background or is preventing it from loading.
Another trick is using your console / inspect element to manually inject the background-image and see if that works... So once the page has loaded in chrome, inspect the element as normal.. And double click on your css property listing as you can add your own styles this way and if it fails, then its not the markup but something else.

Why do Chrome developer tools and actual Chrome rendering differ?

I've posted an image of what my Chrome debug tools look like on a fairly standard JQuery Mobile page. I've already figured out that it actually isn't using the :visited style because none of the links are actually visited. I didn't have an :active style so the links were still blue. So I know what I need to do to fix it, but that's not my question. My question is why is it telling me that it is using that style when it is not? Is this a Chrome bug or am I reading the tool wrong?
You are looking at the total inheritence of all classes. To see what final properties are being applied clicked on "computed"
Also this looks like JQUERY mobile so I suspect you are going to run into some issues of very large class paths that are not easy to detect. I posted a few of these up here - one in particular about styling buttons.

Drop Down menu doesn't display in Internet Explorer

I need help figuring out why the menu I have created does not work properly in IE. I'm currently in a HTML/CSS class so my experience level is limited. I'm kind of just googling things and checking my book as I go.
I created this menu from a tutorial I found after googling "css drop down menu". I'm pretty proud of it but I can't figure out why it does not display properly in Internet Explorer. It seems to work great in Firefox and Chrome, and more importantly, on ipads. My company currently uses a java menu and I'd like to replace it with this.
Here is the link:
http://net.saddleback.edu/hyosafi0/CIM271A/random/menutest/menu.htm
I would appreciate any advice on why it does not work in IE or where I should start looking in my code for errors. I think it has something to do with declaring a doctype but I'm not sure.
Thanks ahead.
You are missing an <li> tag on the second Home link.
Also, try inserting <!DOCTYPE html> at the top of your html file. This will get IE out of Quirks mode, which can solve some problems in the future.

Firefox not completeing stylesheet; works fine in Chrome and Safari

Firefox does not seem to be completing every aspect of the stylesheet for the site (nsfw text) www.theshandy.com
Firefox seems to have implemented the body styling but none of the class or id styles. Every other browser seems to be having no trouble at all.
After doing some research I have tried fixing problems other people have found. The sheet is directly linked (not called by php). The type is definitely text/css. And I believe it has the correct utf-8 character set.
I am really at a loss.
Thank you very much.
EDIT SOLVED:
It was a rogue apostrophe in one of the early ID styles. Apparently chrome and safari will ignore is and firefox won't and it then refused to load the rest of the stylesheet (creating the idea that the body styles were loading but not others.
Thank you for trying to help!
Check your paths.. you might be using /css/style.css instead of css/style.css.
This could generate this problem.

Handling browsers that don't do SVG properly: best way to redirect/load different css/show redirection link?

I have a webpage which I have made entirely as svg (apart from the html to load the svg). So far, so good, and you can see it here (not yet complete): http://kitandmarcin.us/svgcontainer.html (it's for my own wedding, so "the client" doesn't care that not all users are getting the same experience).
This works just great in Firefox, Safari, and Chrome. It basically doesn't work in IE (including IE9), or Opera. I haven't tested anything else.
My question is, what is the best way to handle giving IE (and, I suppose Opera) users either (a) a redirection to a different page, or (b) show them something else (probably a screenshot).
I would prefer not to use javascript, because I suspect if they are already having trouble viewing the page, problems on their end with javascript are quite possible.
It works fine in Opera 11 / Windows.
You should consider just making it in good old HTML/CSS - it's not a particularly complex layout.
Alternatively, use javascript on your parent page to redirect users of IE to a static PNG version of your SVG.
IE8 simply does not support SVG without a plugin - javascript will work just fine on the page. However, SVG is supposed to work in IE9, so I'm not sure why yours doesn't. I don't yet have IE9 here, so I can't test.
ForeignObject is probably the answer why it doesn't work. Given that your svg is quite simple, I'd suggest removing the foreignObjects and using svg text and tspan elements instead. That should make it work in all browsers. And seeing how you used inkscape to create the svg it could have done all the linewrapping etc for you anyway.
From other answer about flow-elements in inkscape:
Inkscape can generate <text> and <tspan> for
you quite easily, just don't click and
drag an area but instead just click
where you want the text and start
writing, then press return where you want a
new line.
I'm not sure if IE9 supports foreignObject.
There's a way to do automatic linewrapping in svg tiny 1.2, which is supported in Opera, a workaround solution could look something like this. But to get IE9 compat too, you'll probably have to go with text+tspan.

Resources