Re: [css-d] limitations to sprites?

2013-06-05 Thread COM

On Jun 4, 2013, at 6:25 PM, Philippe Wittenbergh e...@l-c-n.com wrote:

 So yeah, eventually good for small icons and the like, that are used 
 repeatedly all over the site. As for the size, bear in mind the above about 
 browser memory usage, and then your ability to keep track of them. All 
 depends on your target audience, targeted devices, etc.

Thank you, Philippe…

am I correct that any app that can show a given icon's x-y coordinates in 
pixels is suitable for creating/exporting the final sprites sheet? All one must 
do is jot down the coordinates for the given sprite and have them handy when 
writing the css?

I find myself using an OS X draw app called Sketch more and more these days..it 
seems nicely focused toward web graphics workflow, but so far, I don't notice 
that it exports a sheet of coordinates; just the graphic. Guess I'll have to do 
the coordinates old-school..

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] linear-gradient

2013-06-05 Thread Barney Carroll
This is one of those cases where the syntax is so convoluted and forked I
can never remember it myself — but when I don't have SASS at my disposal I
always go to this tool:
www.colorzilla.com/gradient-editor/

It even throws in IE filter and svg data-uri polyfills!
On Jun 5, 2013 10:58 PM, Angela French afre...@sbctc.edu wrote:

 Hello,
 I am using to make sense of some background-image: linear-gradient.  My
 code is  as follows:

 background-image: linear-gradient(to bottom, red, yellow);

 I thought the to as the first parameter must have been a typo and that
 it should be top as in top to bottom on the gradient.  But if I change
 the syntax to top the gradient doesn't work.  Can anyone explain please?

 Angela French
 Internet Specialist
 State Board for Community and Technical Colleges
 360-704-4316
 afre...@sbctc.edu
 http://www.checkoutacollege.com/
 http://www.sbctc.edu

 __
 css-discuss [css-d@lists.css-discuss.org]
 http://www.css-discuss.org/mailman/listinfo/css-d
 List wiki/FAQ -- http://css-discuss.incutio.com/
 List policies -- http://css-discuss.org/policies.html
 Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] linear-gradient

2013-06-05 Thread Ben Henick



On 6/5/13 4:57 PM, Angela French wrote:


background-image: linear-gradient(to bottom, red, yellow);



...What Barney C. said.  But if you're a glutton for punishment, the 
value syntax is as follows:


linear-gradient(angle|keyword, color1 stop1, color2 stop2, ...);

Angles are provided in the form {int}deg and 0deg = 12 o'clock (top to 
bottom) unless it's part of -webkit-linear-gradient, in which case 0deg 
= 3 o'clock.


Only one keyword is needed; the gradient will travel across the affected 
element from there.  If two (space-separated) keywords are provided, 
they should be on different axes by way of indicating a corner.


Any valid color value will do, as will any valid length value for the 
locations of the stops.  If stop lengths are omitted, the first color 
will be on the left edge, the last on the right, and the other colors 
will be evenly spaced along the gradient.


If a CSS property with more verbose values (that aren't data URIs) 
exists, I haven't found it yet.



--
Ben Henick  lurker...@henick.net
Sitebuilder At-Larget:@bhenick
+1 785 856 1863
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/