firefox skinning equivalent of this...

[Rexel]

these settings are for m2 gui skinning

these settings just cut the image up so that the left border and right border from the image are 8px, 18px...

Tab.Active.Image=control\tab_active.png
Tab.Active.Image.StartOffset=8
Tab.Active.Image.EndOffset=18
Tab.Active.Image.Stretch=0

...and the mid section of that image is repeated along the length of the tab width up to the right border.. I think you get the idea.

So what is the mozilla/firefox css equivalent of getting the same thing done..

[Aronnax!]

I use in my new FF 3.5 themes versions now a -moz-border-image: solution
http://www.takebacktheweb.org/

One image ... settings just cut the image up so that the left border and right border ... the mid section of that image is repeated along the length of the tab width up to the right border..

This is exactly how -moz-border-image stuff works.

An example from my themes:
.tabbrowser-tab[selected="true"] {
-moz-border-image: url("chrome://browser/skin/tabbrowser/tab-active.png") 0 3 repeat stretch;
}

More about it:
http://ejohn.org/blog/border-image-in-firefox/

Cheers

[Rexel]

I'm surprised this hadn't already been implemented :S

anyway thanks it does work.. guess I'll work on the theme for 3.5 then

[Rexel]

hmm so I had better look this "-moz-border-image: solution "

but really its not at all as useful as the m2 skinning method..

reason being is that well you still have to a have a border in order to use it.. so for purpose of a background hover.. that appears behind a toolbarbutton stretches the mid section, and left/right sides remain properly fixed.. while not having to make things look extra fat by adding in a border width.. this solutions seems to suck.. maybe I'm missing something.. but I don't want to be using a border width...

-moz-border-image:
does not at all compare to the m2 background image slicing method.

[Rexel]

just for anyone who doesn't get the m2 method of

"Tab.Active.Image=control\tab_active.png
Tab.Active.Image.StartOffset=8
Tab.Active.Image.EndOffset=18
Tab.Active.Image.Stretch=0"

seeing as its not really a css spec, and just a specifically designed for m2.



Why isn't there css spec with this method.. this entire -moz-border-image method is well a bit rubbish in way.. specially if you dont' want to be adding any extra border width.. which in Firefox seeing as toolbar buttons/tabs already take up enough space adding more border width is just stupid.. or going through the huge hassle of resizing existing settings just so that a border-image method fits in once you've messed about fine tuning border width.. its crap.

.. this method just implements the fine tune control over slicing an image, still allowing the stretch/tile while just rendering it like a background image, not extra border width nonsense.

[Aronnax!]

Why isn't there css spec with this method.. this entire -moz-border-image method is well a bit rubbish in way..

Yes, why? Heaven knows, but who cares

To bug the W3C with your wishes

You can use the usual well known CSS stuff .. and new with FF 3.5 is -moz-border-image and multiple background images http://www.w3.org/TR/css3-background/#layering

Still not enough? Then build your own browser and invent your own CSS

Cheers

[ShareBird]

"there is no data. there is only xul"

Because my theme still compatible to FF 1.5 - 1.6a1 I use XBL to do this...

[Rexel]

this Layering multiple background images... it seems like it might come close with a lot more hassle in manual providing pre sliced images (instead of just doing as above).. but even then I'm thinking.. it repeats each layer? so while I could provide [left image], [center image(repeated)], [right image].. the center image would still get shown behind the left/right images transparent areas.. , unless I'm not reading it all cleary and the background-position allows you to control that?

would also be nice if w3c could be bothered to provide decent visual examples of the more complicated css declarations -it would help.

"To bug the W3C with your wishes".. might have to do that

"-moz-border-image" ...nah given up on that... just pointless for using in the FF UI imo.. maybe for certain webpage it'll come in handy-maybe... but trying to implement that into things like tabbar buttons or tabbutton graphics while making a decent skin looking .. pointless everything just looks bloated and **** because you have to have increase the border width just to see any of the sliced image.. tis stupid really... that same level of slicing control,stretch/repeat etc over a background image instead where you can leave existing border widths if any alone and not have to mess about readjusting everything.

[Rexel]

"Because my theme still compatible to FF 1.5 - 1.6a1 I use XBL to do this..."

0_o?

I'm not following... what are you saying exactly?

[Aronnax!]

the background-position allows you to control that?

yes

[LoudNoise]

Rexel

You mind dropping the four letter words? faq.php?mode=rules#f41 .

Also, are you developing a theme? I ask because this seems to be a discussion about the merits of particular technologies. If that is the case it really belongs in Tech rather than here.