Pesquisar no apoio

Evite burlas no apoio. Nunca iremos solicitar que telefone ou envie uma mensagem de texto para um número de telefone ou que partilhe informações pessoais. Por favor, reporte atividades suspeitas utilizando a opção "Reportar abuso".

Saber mais

I just uploaded Firefox 15.0 and discovered that my pages border-images stopped working. Why?

  • 10 respostas
  • 8 têm este problema
  • 3 visualizações
  • Última resposta por erink1234

more options

My css border-images were working until i upgraded to Firefox 15

My css border-images were working until i upgraded to Firefox 15

Todas as respostas (10)

more options

You probably need to duplicate your old rule so it appears with and without the -moz prefix. With prefix for Fx3.5-Fx14 and without prefix for Fx15+

For example:


-moz-border-image:url("border-image.png") 25 30 10 20 repeat; border-image:url("border-image.png") 25 30 10 20 repeat;

See: border-image | Mozilla Developer Network.

(And yes, these changes are annoying!)

Also possibly of interest: Firefox 15 for developers | Mozilla Developer Network.

more options

This is what I was using with success prior to the update:

border-width: 0px 0px 7px 0px; -moz-border-image:url(images/menu_dots.png) 0 0 7 0 repeat; -webkit-border-image:url(images/menu_dots.png) 0 0 7 0 repeat;

   border-image: url(images/menu_dots.png) 0% 0% 100% 0% repeat;
   border-image: url(images/menu_dots.png) 0 0 7 0 repeat;
more options

Could you post a URL for a live page showing the problem?

more options

http://theclearing.org/test/support.shtml

all the menu (sidebar and main) list items and main page sections should have a 'rustic' dotted line between them

more options

you can see what it looks like in chrome...

more options

Edit: See next post for preferred solution
Firefox is reading your "border-image-width" values (0 0 7 0) in as "border-image-slice" values and defaulting to a width of 1.

The "long form" works, but I can't figure out how to get the shorthand syntax to work:


border-image-source: url(images/menu_dots.png); border-image-width: 0 0 7px 0; border-image-repeat: repeat;

(I don't have Chrome on this PC.)

Modificado por jscher2000 - Support Volunteer a

more options

Scratch that prescription. You have this now:


border-width: 0px 0px 7px 0px; /* places a dotted bottom border under menu items */ -moz-border-image:url(images/menu_dots.png) 0 0 7 0 repeat; -webkit-border-image:url(images/menu_dots.png) 0 0 7 0 repeat; border-image: url(images/menu_dots.png) 0% 0% 100% 0% repeat; border-image: url(images/menu_dots.png) 0 0 7 0 repeat;

According to a post by David Baron (David Baron's weblog: CSS border-image changes and unprefixing), the only thing you need to add is the full border style (i.e., style and color):


border-bottom: 7px solid transparent;

Modificado por jscher2000 - Support Volunteer a

more options

Looks that Firefox wants a border-style to be used if the image can't be displayed.

#dots_defined200, #sidebar_nav ul li { border-style: groove; }
more options

I've had the same problem and after trying almost everything in an attempt to resolve the issue, cor-el has finally found the solution - and it's simple! Thanks!

more options

Got it! Thanks cor-el. Hey, thanks to everyone for taking the time to look. I really appreciate it!