473,769 Members | 6,337 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Question about background: transparent

I've been updating some CSS today and got one odd error from the validator
at http://jigsaw.w3.org/css-validator/. Every time I had 'background:
transparent;' (or background-color: transparent;) associated with a
selector, it gave me this error message:

Line : 30 (Level : 1) You have no background-color with your color :
#navlist li a

Here's the CSS fragment that it doesn't like:

#navlist li a {
color : #ffffff;
background-color : transparent;
text-decoration : none;
display : block;
}

The error went away when I changed the value to "inherit" or to a specific
color, like "#ffffff". According to the CSS reference I use, "transparen t"
is a perfectly acceptable value for "background " and "background-color". Any
idea why I am getting the error?
--
Rhino
Nov 23 '05 #1
9 2116
On Fri, 18 Nov 2005, Rhino wrote:
I've been updating some CSS today and got one odd error from the
validator at http://jigsaw.w3.org/css-validator/. Every time I had
'background: transparent;' (or background-color: transparent;)
associated with a selector, it gave me this error message:

Line : 30 (Level : 1) You have no background-color with your color :


It's not an error, it's a warning, and has been discussed here quite
recently. I'd suggest reading previous discussions for a fuller
explanation.

In brief, you run a risk that your text colour will not contrast with
whatever background colour emerges from the cascade for the underlying
element that you're allowing to shine through. It's safer to define
the colour explicitly. You have to weigh up the issues and decide.
Nov 23 '05 #2

"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote in message
news:Pi******** *************** ******@ppepc56. ph.gla.ac.uk...
On Fri, 18 Nov 2005, Rhino wrote:
I've been updating some CSS today and got one odd error from the
validator at http://jigsaw.w3.org/css-validator/. Every time I had
'background: transparent;' (or background-color: transparent;)
associated with a selector, it gave me this error message:

Line : 30 (Level : 1) You have no background-color with your color :
It's not an error, it's a warning, and has been discussed here quite
recently.


Sorry, you're right. I misspoke; it is indeed a warning.
I'd suggest reading previous discussions for a fuller
explanation.
Thanks, I'll have a look through the archives....
In brief, you run a risk that your text colour will not contrast with
whatever background colour emerges from the cascade for the underlying
element that you're allowing to shine through. It's safer to define
the colour explicitly. You have to weigh up the issues and decide.


Is inherit a reasonable value to use or must I set a specific colour?

Rhino
Nov 23 '05 #3
Once upon a time *Rhino* wrote:
"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote in message
news:Pi******** *************** ******@ppepc56. ph.gla.ac.uk...
In brief, you run a risk that your text colour will not contrast with
whatever background colour emerges from the cascade for the underlying
element that you're allowing to shine through. It's safer to define
the colour explicitly. You have to weigh up the issues and decide.


Is inherit a reasonable value to use or must I set a specific colour?


If it's resonable, depends on the color you have set for the parent
block (e.g. body).

If you have no background color (or transparent) the users browser may
use a default color that makes the content invisible. With inherit the
user mostly will see the color that are inherited from a parent block
and hopefully also the content.

But the warning only tells you the possibilities with transparent (or
no color), it's up to you to decide if it's important or not.

--
/Arne

Now ignoring all top posters
* How to post: http://www.cs.tut.fi/~jkorpela/usenet/brox.html
-------------------------------------------------------------
Nov 23 '05 #4
On Fri, 18 Nov 2005, Rhino wrote:
In brief, you run a risk that your text colour will not contrast with
whatever background colour emerges from the cascade for the underlying
element that you're allowing to shine through. It's safer to define
the colour explicitly. You have to weigh up the issues and decide.


Is inherit a reasonable value to use or must I set a specific colour?


Both 'transparent' and 'inherit' rely on getting something appropriate
from the result of the cascade at a different level.

In the wider practical context, one has to consider the results of
cascading with other stylesheets - some of which might not be under
your control, e.g a user stylesheet, or a corporate stylesheet if your
company insists on one - and also possible browser bugs.

If every cascaded stylesheet follows the guideline that every CSS rule
should explicitly specify either text colour *and* background colour,
or neither, then the possibilities for problems are much reduced.
But this is a guideline, not a fixed rule. What you're getting from
the validator is, after all, a warning, not an error.

But now I'm just repeating the earlier discussion in other words, so
I'll stop.
Nov 23 '05 #5
"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote:
Both 'transparent' and 'inherit' rely on getting something appropriate
from the result of the cascade at a different level.


Thus, 'inherit' is no real improvement over 'transparent', especially since
'inherit' isn't even supported by IE. It's a pity that people use tools like
the "CSS Validator" to get some mystic "approval" and complain about
reasonable warnings or shut them down by making useless or worse than useless
changes to their style sheets.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Nov 23 '05 #6

"Jukka K. Korpela" <jk******@cs.tu t.fi> wrote in message
news:Xn******** *************** ******@193.229. 4.246...
"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote:
Both 'transparent' and 'inherit' rely on getting something appropriate
from the result of the cascade at a different level.
Thus, 'inherit' is no real improvement over 'transparent', especially
since
'inherit' isn't even supported by IE.


Really? It works fine for me in IE6, at least to the extent that it makes
the warning go away and doesn't mess up my pages. Mind you, that may be more
luck than good coding on my part :-)
It's a pity that people use tools like
the "CSS Validator" to get some mystic "approval" and complain about
reasonable warnings or shut them down by making useless or worse than
useless
changes to their style sheets.

I assume you are generalizing, and not just talking about me :-)

Nevertheless, let me say that I found the warning less than clear and
primarily wanted to understand what it was saying and what it implied for
the design of my style sheets. I wasn't primarily trying to get approval or
prevent reasonable warnings. I find some of the messages produced by the CSS
validator to be fairly cryptic: making them clearer and/or linking them to
tutorials to explain the broader issues raised by the messages would go a
long way to helping me write better CSS. But I don't have the expertise to
do this and I don't have the authority to order anyone else to do it so the
best I can do is try to understand what's going on :-)

There's another aspect to this that no one has mentioned.

If I have any halfways substantial number of selectors in my CSS, I might
state the same colour combination for color/background-color quite a few
times. That means that if I want to change that color, I have to change it
in many places. If I use some kind of "change all" command in my editor,
that is not too big a problem but if I change the instances manually, it is
very easy to miss one or two instances of the colour, which can cause some
confusion.

Now, if CSS provided variables, like programming languages do, that would
make life a lot easier. For instance, I would like to be able to do
something like this:

myBackgroundCol or = #0000cc;
myTextColor = #ffff66;

p {
background-color: myBackgroundCol or;
color: myTextColor;
}
td {
background-color: myBackgroundCol or;
color: myTextColor;
}

etc.

Then, changing the background-color would simply be a matter of changing it
once where the variables are defined, even if your editor didn't have a
"change all" feature.

Has anyone heard if there are plans to provide this sort of variable in
future version of CSS? I'm definitely not holding on breath on this being
provided, just curious to know if it is "in the works".

Rhino
Nov 23 '05 #7
On Sat, 19 Nov 2005, Rhino wrote:
Nevertheless, let me say that I found the warning less than clear
As I said, it's been discussed here recently

http://groups.google.co.uk/group/com...4de9f7774fe56a

Note that where the contributor says "known bug" he's referring to the
fact that the validator previously *didn't* issue a warning for
"transparen t". Maybe it should issue one for "inherit" too (except
where both text colour and background colour are defined as
"inherit").

There's a brief mention in the FAQ

http://www.websitedev.de/css/validator-faq#color

which however doesn't mention the implications of using transparent
or inherit, as such.

Note that transparent is the default. Specifying transparent has
similar implications to not specifying anything; the difference is in
terms of the cascade, in that the default has a different cascading
priority than an explicit specification of transparent. But the
outcome is still uncertain, if you're not in sole control of the other
stylesheets with which you are cascading - and taking good care never
to get the cascade wrong, despite browser bugs ;-{
Now, if CSS provided variables, like programming languages do, that
would make life a lot easier.


I'd advise you to accept that it doesn't, and isn't going to.

There's nothing stopping you from devising your own source language,
based on any kind of preprocessor which appeals to you, and pass that
through the preprocessor as part of your publish-to-web procedure
(using "make" to manage source files is a clever way to organise
that).

There are ways to make the preprocessing happen on the web server, at
the time the web pages are accessed, but unless you're very careful
with cacheability issues that can have unfortunate consequences. It's
safer to use a preprocessor, I would say.

Nov 23 '05 #8

"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote in message
news:Pi******** *************** ********@ppepc5 6.ph.gla.ac.uk. ..
On Sat, 19 Nov 2005, Rhino wrote:
Nevertheless, let me say that I found the warning less than clear


As I said, it's been discussed here recently

http://groups.google.co.uk/group/com...4de9f7774fe56a

Note that where the contributor says "known bug" he's referring to the
fact that the validator previously *didn't* issue a warning for
"transparen t". Maybe it should issue one for "inherit" too (except
where both text colour and background colour are defined as
"inherit").

There's a brief mention in the FAQ

http://www.websitedev.de/css/validator-faq#color

which however doesn't mention the implications of using transparent
or inherit, as such.

Note that transparent is the default. Specifying transparent has
similar implications to not specifying anything; the difference is in
terms of the cascade, in that the default has a different cascading
priority than an explicit specification of transparent. But the
outcome is still uncertain, if you're not in sole control of the other
stylesheets with which you are cascading - and taking good care never
to get the cascade wrong, despite browser bugs ;-{
Now, if CSS provided variables, like programming languages do, that
would make life a lot easier.


I'd advise you to accept that it doesn't, and isn't going to.

There's nothing stopping you from devising your own source language,
based on any kind of preprocessor which appeals to you, and pass that
through the preprocessor as part of your publish-to-web procedure
(using "make" to manage source files is a clever way to organise
that).

There are ways to make the preprocessing happen on the web server, at
the time the web pages are accessed, but unless you're very careful
with cacheability issues that can have unfortunate consequences. It's
safer to use a preprocessor, I would say.

Or use an editor that has a "change all" feature to change all occurrences
of a given colour quickly and easily :-)

I certainly don't want to tackle a preprocessor simply so that I can give
myself variables; I don't do nearly enough CSS to justify that. I was just
wondering if that functionality might come to CSS on its own at some point,
although I certainly didn't expect that it would.

Thanks to all who responded on this thread; it was quite educational for me!

Rhino


Nov 23 '05 #9
On Sat, 19 Nov 2005, Rhino wrote:
"Alan J. Flavell" <fl*****@ph.gla .ac.uk> wrote in message
[much quotage snipped...]
It's safer to use a preprocessor, I would say.


Or use an editor that has a "change all" feature to change all
occurrences of a given colour quickly and easily :-)

I certainly don't want to tackle a preprocessor simply so that I can
give myself variables;


But your "use an editor" proposal is also a form of preprocessor!
(Just has more possibilities of screwing things up by replacing things
that matched only by coincidence - especially if you're doing it
interactively and replacing the original source...)
I don't do nearly enough CSS to justify that.


Maybe you have something much more comprehensive in mind as a
preprocessor. But it's an idea that can be applied at almost any
level of complexity, from a simple match-and-replace to something
much more complex, whatever you're comfortable with.

cheers
Nov 23 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
50922
by: Andy Smith | last post by:
I am trying to get a background within a table transparent. I am using: style="filter:alpha(opacity=65);" The only problem is that everything within the table is now faded. Not my intention. I would just like the background the be semi-transparent. Any help would be greatly appreciated. Andy
4
9835
by: Keon | last post by:
Hoi Do someone know how i can make the background of a iframe transparancy? I already tried it with filter: Alpha(Opacity=50,); but it also make the text transperancy. do someone know how to do this? greetings Koen
5
1543
by: amerar | last post by:
Hi All, I have this CSS that I use in one of my emails. When I view the email in Netscape, the style sheet looks fine and the page comes out fine....... However, when I view the email using Yahoo, or Hotmail, or any of the web based emails, it gets totally screwed. Anyone know why this is?
33
2509
by: amerar | last post by:
Hi All, I can make a page using a style sheet, no problem there. However, if I make an email and send it out to my list, Yahoo & Hotmail totally ignore the style tags. It looks fine in Netscape though..... Question: I've tried linking & embedding the style tags with no luck. How can I use them inline? I've read that inline style sheets is the way to go if you want them to work in most email clients.......
1
1410
by: amerar | last post by:
Hi All, I posted a question about style sheets, and why certain email clients were ignoring them. Someone suggested placing them inline. I did this and get better results, but not what I wanted. The page still appears properly, and it shows in Netscape Messenger just fine, but on Hotmail and Yahoo, each <DIV> tag does not appear where it is supposed to appear.
1
20179
by: Efkas | last post by:
My application have some level : 1. MyButton class with Label inheritance 2. MyComponent as User Control loading and positionning some of MyButtons 3. MyApp loading and positionning MyComponent I prefer don't insert a background in MyComponent, and using the MyApp one as general background with MyComponent positionned, but I am not able to have MyComponent background transparent.
8
10610
by: Grahammer | last post by:
Is it possible to set the background of a usercontrol as transparent? I tried setting the background image of the usercontrol to a transparent GIF, but that caused MAJOR problems. I'm making some controls that aren't rectangular and it won't be pretty if I end up with a grey rectangle behind each one. http://msdn.microsoft.com/library/en-us/vbcon/html/vbtskGivingYourControlTransparentBackground.asp?frame=true
1
1340
by: =?Utf-8?B?QW5kcmV3?= | last post by:
Email Question: When I send an email (basically a sms to a phone) from ms outlook it works fine. When I try to send it pragmatically I get an error stating that it can’t relay for <the email address> Try If Not strMailSv = "" Then If Not msgTo = "" Then
8
10176
by: Brian Ward | last post by:
I am looking for a simple way to set the image transparency in a PictureBox. I have a moving PictureBox containing a graphic image .. moving by incrementing its Left property. The background however shows white as the PictureBox moves but I want it to be transparent. The PictureBox BackColor is set to Transparent .. but no affect. I have used PhotoShop to make the image background transparent .. again no affect. If I make the image a...
0
9589
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9423
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10222
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10050
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9999
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
6675
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
1
3967
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
3570
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2815
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.