Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

了解更多

CSS border-image support seems to have been removed in 4RC

  • 5 回覆
  • 49 有這個問題
  • 1 次檢視
  • 最近回覆由 cor-el

more options

I installed the 4 RC and now the CSS border-image styles I'm using don't seem to be supported. The borders look just like they do in IE9 and who whats that!? Before I upgraded my beta versoin border-image behaved like it does in Chrome

I installed the 4 RC and now the CSS border-image styles I'm using don't seem to be supported. The borders look just like they do in IE9 and who whats that!? Before I upgraded my beta versoin border-image behaved like it does in Chrome

所有回覆 (5)

more options
more options

@Topic: Stupidness of this move is just mind blowing...

@UP: Hay, its an old CSS reference (FF3.6 times). Its useless with FF4.

Example: Link: CSS3.info

Browsing with FF4 we see first two borders like orange double styled solid lines. Snapping with Firebug, we can't see ANY 'border-image' phrase. Next, and last, two borders are images showing how its going to be displayed.

Q: But there might be nothing about border-image in this demo! It might be fake, so FF4 is correct. A: Go ahead to the raw CSS file (link) and search for the '#border-image-1'. And what? We have 6 (six!) variants of implementing border-images and FF4 still gives a f*ck...

由 proxyy 於 修改

more options

On the http://www.css3.info/preview/border-image/ it seems to be caused by the order of the CSS rules.
If I move the border: double orange 1em; rules to above the xxx-border-image rules then it works.
So apparently placing using border rule at the end disables all border rules (including the -moz-border-image that gets changed to none) that are placed above them. This might be expected and you should use specific rules (border -color, border-style, border-width etc.) in such an situation.

#left_column #border-image-1 {
margin: 0 30px;
width: 270px;
padding: 14px;
border: double orange 1em;
-o-border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
-icab-border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
-khtml-border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
-moz-border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
-webkit-border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
border-image: url('/wp-content/uploads/2007/09/border.png') 27 round round;
}

#left_column #border-image-2 {
margin: 0 30px;
width: 270px;
padding: 14px;
border: double orange 1em;
-o-border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
-icab-border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
-khtml-border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
-moz-border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
-webkit-border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
border-image: url('/wp-content/uploads/2007/09/border.png') 27 stretch stretch;
}
more options

Yay! One point for you cor-el. I didn't noticed that move by myself.

So, my last words about it are: WHY for god sake is that difference?! Why FF4 wants to mess up borders. Where's FF 3,6 border & border-image independence...

more options

The HMTL parser in Firefox 4 is much stricter than in previous Firefox 3 versions, so CSS that worked before might need attention and correction. Some older code is no longer supported and like in this situation there may be dependencies that were previously not present.