Firefox 30.0 - -Moz-Appearance: None Not Working

Jquery .show() not working in firefox

I had a similar problem and my solution was to do

$("#psharebutton").css("display", "inline-block");

instead of

$("#psharebutton").show();

A jquery "show" is identical to setting the display style attribute to "block". I found that I needed "inline-block" for firefox and chrome (I didn't need this for IE). I believe (but have not confirmed) that jquery is smart enough to know what the previous display value is and use that, but in my case I started out with display set to "none" so there was no previous value.

element.style.display = 'none' not working in firefox but is in chrome

@Neil is partly correct. The reason its not working is because of the way that Mozilla has implemented transitions.

However its the opposite of what he said. The transition is applied, its the display:none that is not applied. It essentially gets overruled by the fact that there is a transition rule in the css.

The way around this (currently, hopefully Mozilla changes their implementation) is to use multiple functions and 2 different css class rules. (which is bulky but still can be simpler then moving something with javascript).

So your first class has a transition on it that moves the tile off screen. It then gets a new class that has no transition rule. you can then set its position with javascript to the opposite side of the carousel and it will go there instantly without being visible because it no longer has a transition property. Finally you re-apply the transition class, and move it to its final position on the other side of the carousel.

The effect is the same as achieved in Chrome, but definitely not as elegant.

Disable remember password in browser in Firefox 30.0/Chrome Version 35.0.1916.153 m

This is a browser specific feature and support has been discontinued by major browsers because of compatibility issues.
Is autocomplete="off" compatible with all modern browsers?

Triangle created using borders looks weird in firefox 30.0

It would be easier to set li as position:relative and set your triangle within in absolute: DEMO

.nav-triangle {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    height: 0;
    margin: 0 auto;
    position: absolute;/* nail it where you want ! with coordonate and eventually margins , parent is in relative*/
    top:8px;/*width of colored top border */
    left:50%;
    margin-left:-10px;
    z-index:1;
    width: 0;
}

.nav li {
    text-align: center;
    width:100%;
    list-style-type: none;
    position:relative;/* for absolute child */
}

Firefox Placeholder Before CSS selector not working

The issue is not with the placeholder, but the fact that you are trying to apply a ::before pseudo-element to an input, which isn't supported cross-browser because it's not defined within the standards. See this answer.

Since this obviously depends on the form element being [data-required] (although it's not clear to me why you need a data-required attribute in addition to the standard required), you may need to add an extra span element after the input and style that element using a sibling selector, rather than using a pseudo-element.

How can I find good tutorial for building firefox add-ons on latest version of firefox 30.0?

Alright, as we figured out together, the XPI file was incorrectly zipped.

It did not include the XPI items directly as it should have, but within a subfolder in the zip.

Correct zipping of XPI files is further discussed here.

---

Related Topics