[css-d] Background-Image overrides background color
The background image should sit on-top of the background color,
instead the background color is overriding my background image ?
background-color:#343630;/*#b7b7b7;*/
background:url("/wdp/wip/overlay_bg.png");
background-position:top;
background-blend-mode: overlay;
margin:0;
padding:0;
font:100%/1.3 arial, helvetica, sans-serif;
Christopher
__
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] Background-Image overrides background color
Try making the background color the last item in the list.
On Sat, Jan 10, 2015 at 11:59 PM, Crest Christopher <
crestchristop...@gmail.com> wrote:
>The background image should sit on-top of the background color, instead
> the background color is overriding my background image ?
>
> background-color:#343630;/*#b7b7b7;*/
> background:url("/wdp/wip/overlay_bg.png");
> background-position:top;
> background-blend-mode: overlay;
> margin:0;
> padding:0;
> font:100%/1.3 arial, helvetica, sans-serif;
>
> Christopher
> __
> 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] Background-Image overrides background color
I would suggest a little trip to WC3.
You have posted this a lot. it should be
background-image:
if your just setting the url attribute to your background image.
background:
if your setting the url, position, size, origin, color, etc as the shorthand
notation.
See here:
http://www.w3schools.com/css/css_background.asp
I would suggest you google every css attribute you can so you familiarize
yourself with it before using.
That's what I did.
Best,
Karl DeSaulniers
Design Drumm
http://designdrumm.com
On Jan 10, 2015, at 10:59 PM, Crest Christopher
wrote:
> background:url("/wdp/wip/overlay_bg.png");
__
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] Background-Image overrides background color
2015-01-11, 6:59, Crest Christopher wrote:
The background image should sit on-top of the background color,
Yes, if both are specified.
instead the background color is overriding my background image ?
background-color:#343630;/*#b7b7b7;*/
background:url("/wdp/wip/overlay_bg.png");
background-position:top;
background-blend-mode: overlay;
margin:0;
padding:0;
font:100%/1.3 arial, helvetica, sans-serif;
Can you please provide a complete example? This code can hardly produce
the effect described. The background shorthand sets background-color to
transparent, so there is either the background image alone or, if it
does not exist, no background, i.e. the enclosing element’s background
will shine thru.
If you replace background by background-image, the situation changes.
Then, if the image exists, it will be blended with the background color,
as specified by background-blend-mode: overlay (on supporting browsers).
Yucca
__
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] Background-Image overrides background color
2015-01-11, 9:48, Karl DeSaulniers wrote: I would suggest a little trip to WC3. I wonder what that means. See here: http://www.w3schools.com/css/css_background.asp The w3schools site, unreliable and with rather low information/noise ratio, intentionally wants to be confused with the Word Wide Web Consortium, W3C. Please do not contribute to this confusion. The W3C material on CSS is as authoritative as you can get in the area of CSS, but it’s mostly not suitable for use as tutorials. The Mozilla Development Network material https://developer.mozilla.org/en-US/docs/Web/CSS is much more suitable as learning material. And it links to W3C material, so that you can check it too, after learning the basics and getting an idea of how various CSS features are used. I would suggest you google every css attribute you can so you familiarize yourself with it before using. There are no attributes in CSS. Googling every CSS property (which is what you are probably referring to) would be rather pointless. There are about 1,000 different properties in CSS specifications, drafts, and browser-specific documentation. Yucca __ 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] Background-Image overrides background color
On Jan 11, 2015, at 2:02 AM, "Jukka K. Korpela" wrote: > 2015-01-11, 9:48, Karl DeSaulniers wrote: > >> I would suggest a little trip to WC3. > > I wonder what that means. it means study time > >> See here: >> http://www.w3schools.com/css/css_background.asp > > The w3schools site, unreliable and with rather low information/noise ratio, > intentionally wants to be confused with the Word Wide Web Consortium, W3C. > Please do not contribute to this confusion. Matter of opinion Yucca, but I hear ya. For the level christopher is at it will do just fine getting him in line with how things on a basic level work. Did not mean to add to the confusion of W3Schools being WC3 itself. @Christopher, don't confuse W3Schools with WC3... Ok? They are not the same. One is lucifer and the other is God. There I uncontributed. > > The W3C material on CSS is as authoritative as you can get in the area of > CSS, but it’s mostly not suitable for use as tutorials. The Mozilla > Development Network material > https://developer.mozilla.org/en-US/docs/Web/CSS and there you have it! a real contribution. > is much more suitable as learning material. And it links to W3C material, so > that you can check it too, after learning the basics and getting an idea of > how various CSS features are used. > >> I would suggest you google every css attribute you can so you familiarize >> yourself with it before using. > > There are no attributes in CSS. Googling every CSS property (which is what > you are probably referring to) would be rather pointless. There are about > 1,000 different properties in CSS specifications, drafts, and > browser-specific documentation. Yes. sorry not attributes, properties and NO don't go read them all that would be silly. That should read ... every css proplerty you need to so you... There. better? I'm trying here Yucca I really am man. Thank God for your technicalities! We all would be lost without them. :) > > Yucca Karl DeSaulniers Design Drumm http://designdrumm.com __ 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] Background-Image overrides background color
For someone at the OPs level, I'd not recommend a site with such a bad reputation. He won't know if what he is reading is correct. While that site may be improved as of late, why start learning at such a poorly regarded source. There are much more reputable places to learn the basics. Csstricks.com Moz sites Html5doctor On Sun, Jan 11, 2015 at 3:43 AM Karl DeSaulniers wrote: > > > > > On Jan 11, 2015, at 2:02 AM, "Jukka K. Korpela" > wrote: > > > 2015-01-11, 9:48, Karl DeSaulniers wrote: > > > >> I would suggest a little trip to WC3. > > > > I wonder what that means. > > it means study time > > > > >> See here: > >> http://www.w3schools.com/css/css_background.asp > > > > The w3schools site, unreliable and with rather low information/noise > ratio, intentionally wants to be confused with the Word Wide Web > Consortium, W3C. Please do not contribute to this confusion. > > Matter of opinion Yucca, but I hear ya. For the level christopher is at it > will do just fine getting him in line with how things on a basic level work. > Did not mean to add to the confusion of W3Schools being WC3 itself. > > @Christopher, don't confuse W3Schools with WC3... Ok? They are not the > same. One is lucifer and the other is God. > > There I uncontributed. > > > > > The W3C material on CSS is as authoritative as you can get in the area > of CSS, but it’s mostly not suitable for use as tutorials. The Mozilla > Development Network material > > https://developer.mozilla.org/en-US/docs/Web/CSS > > and there you have it! a real contribution. > > > is much more suitable as learning material. And it links to W3C > material, so that you can check it too, after learning the basics and > getting an idea of how various CSS features are used. > > > >> I would suggest you google every css attribute you can so you > familiarize yourself with it before using. > > > > There are no attributes in CSS. Googling every CSS property (which is > what you are probably referring to) would be rather pointless. There are > about 1,000 different properties in CSS specifications, drafts, and > browser-specific documentation. > > Yes. sorry not attributes, properties and NO don't go read them all that > would be silly. That should read ... every css proplerty you need to so > you... > > There. better? I'm trying here Yucca I really am man. Thank God for your > technicalities! We all would be lost without them. :) > > > > > Yucca > > > Karl DeSaulniers > Design Drumm > http://designdrumm.com > > __ > 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] Background-Image overrides background color
Tom Livingston wrote: For someone at the OPs level, I'd not recommend a site with such a bad reputation. He won't know if what he is reading is correct. While that site may be improved as of late, why start learning at such a poorly regarded source. There are much more reputable places to learn the basics. Csstricks.com Moz sites Html5doctor I would personally treat with the greatest suspicion any site claiming to offer guidance on W3C standards that does not itself validate : http://validator.w3.org/check?uri=http://html5doctor.com/ Philip Taylor __ 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] Background-Image overrides background color
It appears that the errors are for things that are not yet part of the spec the validator is based on. I would not call that bad code. On Sun, Jan 11, 2015 at 11:17 AM Philip Taylor wrote: > > > Tom Livingston wrote: > > For someone at the OPs level, I'd not recommend a site with such a bad > > reputation. He won't know if what he is reading is correct. While that > site > > may be improved as of late, why start learning at such a poorly regarded > > source. There are much more reputable places to learn the basics. > > > > Csstricks.com > > > > Moz sites > > > > Html5doctor > > I would personally treat with the greatest suspicion any site claiming > to offer guidance on W3C standards that does not itself validate : > > http://validator.w3.org/check?uri=http://html5doctor.com/ > > Philip Taylor > __ 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] Background-Image overrides background color
I'm amazed it took this long for a link to the W3 validator to creep into the conversation. Maybe if we keep at it the list archives will trump w3schools in search results? Regards, Barney Carroll barney.carr...@gmail.com +44 7429 177278 barneycarroll.com On 11 January 2015 at 16:22, Tom Livingston wrote: > It appears that the errors are for things that are not yet part of the spec > the validator is based on. I would not call that bad code. > > > On Sun, Jan 11, 2015 at 11:17 AM Philip Taylor > wrote: > > > > > > > Tom Livingston wrote: > > > For someone at the OPs level, I'd not recommend a site with such a bad > > > reputation. He won't know if what he is reading is correct. While that > > site > > > may be improved as of late, why start learning at such a poorly > regarded > > > source. There are much more reputable places to learn the basics. > > > > > > Csstricks.com > > > > > > Moz sites > > > > > > Html5doctor > > > > I would personally treat with the greatest suspicion any site claiming > > to offer guidance on W3C standards that does not itself validate : > > > > http://validator.w3.org/check?uri=http://html5doctor.com/ > > > > Philip Taylor > > > __ > 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] Background-Image overrides background color
w3school is at the top for so many searches. It would be great if they would just clean up their site. -- Registered Linux User: #480675 Registered Linux Machine: #408606 Linux since June 2005 On Sun, Jan 11, 2015 at 10:30 AM, Barney Carroll wrote: > I'm amazed it took this long for a link to the W3 validator to creep into > the conversation. Maybe if we keep at it the list archives will trump > w3schools in search results? > > Regards, > Barney Carroll > > barney.carr...@gmail.com > +44 7429 177278 > > barneycarroll.com > > On 11 January 2015 at 16:22, Tom Livingston wrote: > >> It appears that the errors are for things that are not yet part of the spec >> the validator is based on. I would not call that bad code. >> >> >> On Sun, Jan 11, 2015 at 11:17 AM Philip Taylor >> wrote: >> >> > >> > >> > Tom Livingston wrote: >> > > For someone at the OPs level, I'd not recommend a site with such a bad >> > > reputation. He won't know if what he is reading is correct. While that >> > site >> > > may be improved as of late, why start learning at such a poorly >> regarded >> > > source. There are much more reputable places to learn the basics. >> > > >> > > Csstricks.com >> > > >> > > Moz sites >> > > >> > > Html5doctor >> > >> > I would personally treat with the greatest suspicion any site claiming >> > to offer guidance on W3C standards that does not itself validate : >> > >> > http://validator.w3.org/check?uri=http://html5doctor.com/ >> > >> > Philip Taylor >> > >> __ >> 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/ __ 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] Background-Image overrides background color
Tom Livingston wrote: It appears that the errors are for things that are not yet part of the spec the validator is based on. I would not call that bad code. Schoolboy errors, which indicate (to my mind) the level of care (or lack thereof) that went into the preparation of the material : Error Line 453, Column 88: & did not start a character reference. (& probably should have been escaped as &.) …ancybar.net/ac/fancybar.js?zoneid=1502&serve=C6ADVKE&placement=html5doctor" id… ✉ Error Line 453, Column 102: & did not start a character reference. (& probably should have been escaped as &.) Philip Taylor __ 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] Background-Image overrides background color
> > Schoolboy errors, which indicate (to my mind) the level of care (or lack > thereof) that went into the preparation of the material : > > Error Line 453, Column 88: & did not start a character reference. (& > probably should have been escaped as &.) > > …ancybar.net/ac/fancybar.js?zoneid=1502&serve=C6ADVKE&placement=html5doctor" > id… > > ✉ > Error Line 453, Column 102: & did not start a character reference. (& > probably should have been escaped as &.) > > Philip Taylor In a URL string like that, I personally would not look down on the dev for that. -- Tom Livingston | Senior Front-End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com #663399 __ 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] Background-Image overrides background color
Tom Livingston wrote: In a URL string like that, I personally would not look down on the dev for that. We could debate this forever, Tom, and I suspect would never reach agreement. My position (with which you may well disagree) is that I look on it as being similar to a developer who elects to use (say) the Qt library in his/her work and then, when challenged that something does not work as it should, responds "It's a bug in Qt". If a developer elects to use something from without his/her control, then it is his/her responsibility to ensure that it /does/ work as intended (i.e., in this case, validates). "A bad workman blames his tools; a good workman chooses the correct tools and therefore never needs to try to ascribe blame". Philip Taylor __ 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] Background-Image overrides background color
On Sun, Jan 11, 2015 at 12:24 PM, Philip Taylor wrote: > > > Tom Livingston wrote: > >> In a URL string like that, I personally would not look down on the dev for >> that. > > > We could debate this forever, Tom, and I suspect would never reach > agreement. My position (with which you may well disagree) is that I look on > it as being similar to a developer who elects to use (say) the Qt library in > his/her work and then, when challenged that something does not work as it > should, responds "It's a bug in Qt". If a developer elects to use something > from without his/her control, then it is his/her responsibility to ensure > that it /does/ work as intended (i.e., in this case, validates). > > "A bad workman blames his tools; a good workman chooses the correct tools > and therefore never needs to try to ascribe blame". > > Philip Taylor I'll agree to disagree with you. While I agree your code should validate, there are *some* things that can be overlooked. It's been said many time on this list. It's like vendor prefixes or zoom:1; in the CSS validator. It's an error, but if you know why it's an error and know it's there on purpose, you can let it go. I'm not saying you are wrong, Philip. I'm just a little more lenient. -- Tom Livingston | Senior Front-End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com #663399 __ 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/
