I have been trying to use CSS in my ASP.NET pages and am trying to figure
out the Stylesheet order and differences between Netscape (and Mozilla) and
IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css">
************************************************** *****************
a {
font-size:smaller;
}
a:link {
color:#4AAABD;
}
a:visited {
color:#4AAABD;
}
a:active {
color:#4AAABD;
}
************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't
change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a bit
larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; }
a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering
and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and
Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will
turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why
not the color?
Thanks,
Tom 9 1228
"tshad" <tf*@dslextreme.com> a écrit dans le message de news:
e%****************@TK2MSFTNGP14.phx.gbl... If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
First this as nothing to do with ASP.Net in itself. It has to do with the
sloppy implementation of CSS by various versions of IE. (Visual Studio has
however the nasty habbit of showing all non standard Microsoft extensions in
intellisense, it takes discipline to avoid them / use them correctly).
It gets much better with IE6, but it is still waaaaay out of the norm. IE6
implements most of CSS1 and a few of CSS2 (but see caveat below).
Have a look at "quirks mode" in google, IE changes behaviour (to maintain
ascending compatibility) depending on the DOCTYPE string : http://msdn.microsoft.com/library/de...hancements.asp
If you use for instance : <!DOCTYPE html PUBLIC "-//W3C//DTD html 4.01
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
things get better, but you are not yet home.
The most common problem is that many "default" values for IE6 are
different from the HTML / CSS norm, so you should first build a CSS for
explicitly setting most of the default values to something that suits you.
Misrosoft is IMO not entirelly at fault here, since a number of these
"official standard" default values are the most unatural / unexpected of the
available behaviour you can get. For some I get caught each time I use them
(less often now, I have my standard CSS sheet that I paste everywhere). As a
startup point look for the sample CSS sheets from W3C.
Then there are (many) IE6 bugs.
Usually when unexpected behaviour occurs, Mozilla / Firefox is standard
compliant, IE6 is not.
IE6 is waaay out of date (4 years +), IE7 is rumoured to be in the
works, but Microsoft got sleepy and complacent here.
"tshad" wrote: I have been trying to use CSS in my ASP.NET pages and am trying to figure out the Stylesheet order and differences between Netscape (and Mozilla) and IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css"> ************************************************** *****************
a { font-size:smaller; } a:link { color:#4AAABD; } a:visited { color:#4AAABD; } a:active { color:#4AAABD; } ************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a bit larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
Thanks,
Tom
I would say the a:link and a:visited rules are overriding the color
specified by the a rule, since they are more specific. I would be inclined
to say this is the correct behavior, and that IE has its specificity
calculation wrong.
Here are a couple links that might shed some light on the issue: http://www.w3.org/TR/CSS21/cascade.html#specificity http://www.w3.org/TR/CSS21/selector....pseudo-classes
I've just learned there is a correct order to manage specificity when
declaring style for the anchor element. The correct order is alleged to be:
link
visited
hover
active
I learned this at W3Schools and do not remember if an explicit explanation
was given. Try it out.
--
<%= Clinton Gallagher, "Twice the Results -- Half the Cost"
Architectural & e-Business Consulting -- Software Development
NET cs*********@REMOVETHISTEXTmetromilwaukee.com
URL http://www.metromilwaukee.com/clintongallagher/
"tshad" <tf*@dslextreme.com> wrote in message
news:e%****************@TK2MSFTNGP14.phx.gbl... I have been trying to use CSS in my ASP.NET pages and am trying to figure out the Stylesheet order and differences between Netscape (and Mozilla)
and IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css"> ************************************************** *****************
a { font-size:smaller; } a:link { color:#4AAABD; } a:visited { color:#4AAABD; } a:active { color:#4AAABD; } ************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a
bit larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape
(and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
Thanks,
Tom
"Michel de Becdelièvre" <m_*****@msn.com> wrote in message
news:%2****************@TK2MSFTNGP12.phx.gbl... "tshad" <tf*@dslextreme.com> a écrit dans le message de news: e%****************@TK2MSFTNGP14.phx.gbl...
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
First this as nothing to do with ASP.Net in itself. It has to do with the sloppy implementation of CSS by various versions of IE. (Visual Studio has however the nasty habbit of showing all non standard Microsoft extensions in intellisense, it takes discipline to avoid them / use them correctly).
It gets much better with IE6, but it is still waaaaay out of the norm. IE6 implements most of CSS1 and a few of CSS2 (but see caveat below).
Have a look at "quirks mode" in google, IE changes behaviour (to maintain ascending compatibility) depending on the DOCTYPE string : http://msdn.microsoft.com/library/de...hancements.asp
If you use for instance : <!DOCTYPE html PUBLIC "-//W3C//DTD html 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
things get better, but you are not yet home.
The most common problem is that many "default" values for IE6 are different from the HTML / CSS norm, so you should first build a CSS for explicitly setting most of the default values to something that suits you. Misrosoft is IMO not entirelly at fault here, since a number of these "official standard" default values are the most unatural / unexpected of the available behaviour you can get. For some I get caught each time I use them (less often now, I have my standard CSS sheet that I paste everywhere). As a startup point look for the sample CSS sheets from W3C.
Is this why the image size and font size are larger than Mozilla and
Netscape if I use font-size:small?
If I set the default size (say, font-size:12) and then follow that with
small, then I should get the same size for IE and Mozilla?
Also, when you say your standard CSS sheet are you talking about one you set
up yourself? Where would I gat a sample startup CSS sheet from W3C?
Also, how would you handle that? Would you set up a default sheet that all
your other sheets call?
Thanks,
Tom. Then there are (many) IE6 bugs.
Usually when unexpected behaviour occurs, Mozilla / Firefox is standard compliant, IE6 is not. IE6 is waaay out of date (4 years +), IE7 is rumoured to be in the works, but Microsoft got sleepy and complacent here.
"Jeremy Davis" <Je*********@discussions.microsoft.com> wrote in message
news:8B**********************************@microsof t.com...
"tshad" wrote:
I have been trying to use CSS in my ASP.NET pages and am trying to figure out the Stylesheet order and differences between Netscape (and Mozilla) and IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css"> ************************************************** *****************
a { font-size:smaller; } a:link { color:#4AAABD; } a:visited { color:#4AAABD; } a:active { color:#4AAABD; } ************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a bit larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
Thanks,
Tom
I would say the a:link and a:visited rules are overriding the color specified by the a rule, since they are more specific.
But then why is Netscape and Mozilla not using the red from the a:hover rule
as IE is - they use the underline rule?
a:hover { color: #FF0000; text-decoration: underline; }
Thanks,
Tom.
I would be inclined to say this is the correct behavior, and that IE has its specificity calculation wrong. Here are a couple links that might shed some light on the issue: http://www.w3.org/TR/CSS21/cascade.html#specificity http://www.w3.org/TR/CSS21/selector....pseudo-classes
"clintonG" <cs*********@REMOVETHISTEXTmetromilwaukee.com> wrote in message
news:%2****************@TK2MSFTNGP14.phx.gbl... I've just learned there is a correct order to manage specificity when declaring style for the anchor element. The correct order is alleged to be:
link visited hover active
The order didn't seem to matter.
If I put the line from my page into the CSS sheet:
a:hover { color: #FF0000; text-decoration: underline; }
before or after the a:active, it worked correctly and took the red color.
It doesn't seem to take the red if inside the aspx page (but does take the
underline, however - maybe because there is no text-decoration explicitly
defined in the css sheet).
Tom I learned this at W3Schools and do not remember if an explicit explanation was given. Try it out.
-- <%= Clinton Gallagher, "Twice the Results -- Half the Cost" Architectural & e-Business Consulting -- Software Development NET cs*********@REMOVETHISTEXTmetromilwaukee.com URL http://www.metromilwaukee.com/clintongallagher/ "tshad" <tf*@dslextreme.com> wrote in message news:e%****************@TK2MSFTNGP14.phx.gbl... I have been trying to use CSS in my ASP.NET pages and am trying to figure out the Stylesheet order and differences between Netscape (and Mozilla) and IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css"> ************************************************** *****************
a { font-size:smaller; } a:link { color:#4AAABD; } a:visited { color:#4AAABD; } a:active { color:#4AAABD; } ************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a bit larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
Thanks,
Tom
"tshad" wrote: "Jeremy Davis" <Je*********@discussions.microsoft.com> wrote in message news:8B**********************************@microsof t.com...
"tshad" wrote:
I have been trying to use CSS in my ASP.NET pages and am trying to figure out the Stylesheet order and differences between Netscape (and Mozilla) and IE.
I have the following in my .css file that is linked by:
<link href="staffing.css" rel="stylesheet" type="text/css"> ************************************************** *****************
a { font-size:smaller; } a:link { color:#4AAABD; } a:visited { color:#4AAABD; } a:active { color:#4AAABD; } ************************************************** ***************
This makes my links in my menu dark turquoise and underlined. It doesn't change at all when hovering over the links.
It is the same with both Netscape and IE. The letters in IE are quite a bit larger that Netscape, for some reason
This makes it difficult using "small" instead of a fixed size.
If I add the following into the html page:
a { color: #0000BB; text-decoration: none; } a:hover { color: #FF0000; text-decoration: underline; }
In IE and netscape, it takes the underline away when you are not hovering and adds the undeline when you are hovering (as it should).
But, IE will change the letters to "Red", which it should and Netscape (and Mozilla) don't. It is still the dark turquoise. Why is that?
If I take the links out of the .css file, the links will be blue and will turn red when hovering in all the browsers.
So why doesn't it change red in Netscape. The text-decoration works, why not the color?
Thanks,
Tom
I would say the a:link and a:visited rules are overriding the color specified by the a rule, since they are more specific.
But then why is Netscape and Mozilla not using the red from the a:hover rule as IE is - they use the underline rule?
a:hover { color: #FF0000; text-decoration: underline; }
Ah. I hadn't noticed that the red was coming from the :hover rule.
What it seems is happening is that since the :link and :hover pseudo-classes
have the same selectivity whichever is parsed last is the one that takes
precedence. Am I right in assuming that your linked stylesheet comes after
the <style> block in your page?
By the way, I would say it's the :link (and/or :visited) rule that's
fighting with your :hover here, not :active. The link I posted on selectors
explains what they're all about. Thanks,
Tom.
I would be inclined to say this is the correct behavior, and that IE has its specificity calculation wrong. Here are a couple links that might shed some light on the issue: http://www.w3.org/TR/CSS21/cascade.html#specificity http://www.w3.org/TR/CSS21/selector....pseudo-classes
"tshad" <ts**********@ftsolutions.com> a écrit dans le message de news: O7**************@TK2MSFTNGP14.phx.gbl... "Michel de Becdelièvre" <m_*****@msn.com> wrote in message news:%2****************@TK2MSFTNGP12.phx.gbl... "tshad" <tf*@dslextreme.com> a écrit dans le message de news: Is this why the image size and font size are larger than Mozilla and Netscape if I use font-size:small?
If I remember well there is a bug (sorry : "this behaviour is by
design") in pre IE6 versions of IE on this specific instruction.
The bug is either still present in IE6 or dependent on the "quirk mode"
(DOCTYPE), I don't remember.
(Update) Google is your friend : http://msdn.microsoft.com/workshop/a...s/fontsize.asp
Remarks
As of Internet Explorer 6, when you use the !DOCTYPE declaration to
specify standards-compliant mode, the default value for this property is
small, not medium.
Negative values are not allowed. Font sizes using the proportional "em"
measure are based on the font size of the parent object.
Possible length values specified in a relative measurement, using the
height of the element's font (em) or the height of the letter "x" (ex), are
supported in Internet Explorer 4.0 and later.
If I set the default size (say, font-size:12) and then follow that with small, then I should get the same size for IE and Mozilla?
Also, when you say your standard CSS sheet are you talking about one you set up yourself? Where would I gat a sample startup CSS sheet from W3C?
Google is your friend : http://www.w3.org/TR/CSS21/sample.html, http://www.w3.org/TR/REC-CSS2/sample.html
I think I started from one of those two, and built up gradually from
there whenever I noticed a difference in default behavior, it's a work in
progress, and tied to my projects. I also abandoned all support for anything
older than IE6 / Mozilla / Firefox.
"Jeremy Davis" <Je*********@discussions.microsoft.com> wrote in message
news:FB**********************************@microsof t.com...
"tshad" wrote:
"Jeremy Davis" <Je*********@discussions.microsoft.com> wrote in message news:8B**********************************@microsof t.com... > > > "tshad" wrote: > >> I have been trying to use CSS in my ASP.NET pages and am trying to >> figure >> out the Stylesheet order and differences between Netscape (and >> Mozilla) >> and >> IE. >> >> I have the following in my .css file that is linked by: >> >> <link href="staffing.css" rel="stylesheet" type="text/css"> >> ************************************************** ***************** >> >> a { >> font-size:smaller; >> } >> a:link { >> color:#4AAABD; >> } >> a:visited { >> color:#4AAABD; >> } >> a:active { >> color:#4AAABD; >> } >> ************************************************** *************** >> >> This makes my links in my menu dark turquoise and underlined. It >> doesn't >> change at all when hovering over the links. >> >> It is the same with both Netscape and IE. The letters in IE are quite >> a >> bit >> larger that Netscape, for some reason >> >> This makes it difficult using "small" instead of a fixed size. >> >> If I add the following into the html page: >> >> a { color: #0000BB; text-decoration: none; } >> a:hover { color: #FF0000; text-decoration: underline; } >> >> In IE and netscape, it takes the underline away when you are not >> hovering >> and adds the undeline when you are hovering (as it should). >> >> But, IE will change the letters to "Red", which it should and Netscape >> (and >> Mozilla) don't. It is still the dark turquoise. Why is that? >> >> If I take the links out of the .css file, the links will be blue and >> will >> turn red when hovering in all the browsers. >> >> So why doesn't it change red in Netscape. The text-decoration works, >> why >> not the color? >> >> Thanks, >> >> Tom >> > > I would say the a:link and a:visited rules are overriding the color > specified by the a rule, since they are more specific. But then why is Netscape and Mozilla not using the red from the a:hover rule as IE is - they use the underline rule?
a:hover { color: #FF0000; text-decoration: underline; }
Ah. I hadn't noticed that the red was coming from the :hover rule. What it seems is happening is that since the :link and :hover pseudo-classes have the same selectivity whichever is parsed last is the one that takes precedence. Am I right in assuming that your linked stylesheet comes after the <style> block in your page?
Yes.
I know that if you have 2 style sections, the second will take pecedence
over the first.
Is it the same for files?
For example, if I had:
<style>
<link>
<style>
The second style would have precedence over the other 2 and the link would
have precedence over the 1st one?
By the way, I would say it's the :link (and/or :visited) rule that's fighting with your :hover here, not :active. The link I posted on selectors explains what they're all about.
You were right. The link was the problem.
Thanks,
Tom Thanks,
Tom.
> I would be inclined > to say this is the correct behavior, and that IE has its specificity > calculation wrong. > Here are a couple links that might shed some light on the issue: > http://www.w3.org/TR/CSS21/cascade.html#specificity > http://www.w3.org/TR/CSS21/selector....pseudo-classes
This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: William C. White |
last post by:
Does anyone know of a way to use PHP /w Authorize.net AIM without using
cURL? Our website is hosted on a shared drive and the webhost company
doesn't installed additional software (such as cURL)...
|
by: Albert Ahtenberg |
last post by:
Hello,
I don't know if it is only me but I was sure that header("Location:url")
redirects the browser instantly to URL, or at least stops the execution of
the code. But appearantely it continues...
|
by: James |
last post by:
Hi,
I have a form with 2 fields.
'A'
'B'
The user completes one of the fields and the form is submitted.
On the results page I want to run a query, but this will change
subject to which...
|
by: Ollivier Robert |
last post by:
Hello,
I'm trying to link PHP with Oracle 9.2.0/OCI8 with gcc 3.2.3 on a Solaris9
system. The link succeeds but everytime I try to run php, I get a SEGV from
inside the libcnltsh.so library.
...
|
by: Richard Galli |
last post by:
I want viewers to compare state laws on a single subject.
Imagine a three-column table with a drop-down box on the top. A viewer
selects a state from the list, and that state's text fills the...
|
by: Albert Ahtenberg |
last post by:
Hello,
I have two questions.
1. When the user presses the back button and returns to a form he filled
the form is reseted. How do I leave there the values he inserted?
2. When the...
|
by: inderjit S Gabrie |
last post by:
Hi all
Here is the scenerio ...is it possibly to do this...
i am getting valid course dates output on to a web which i have designed
....all is okay so far , look at the following web url
...
|
by: Jack |
last post by:
Hi All,
What is the PHP equivilent of Oracle bind variables in a SQL statement, e.g.
select x from y where z=:parameter
Which in asp/jsp would be followed by some statements to bind a value...
|
by: Sandwick |
last post by:
I am trying to change the size of a drawing so they are all 3x3.
the script below is what i was trying to use to cut it in half ... I
get errors.
I can display the normal picture but not the...
|
by: DolphinDB |
last post by:
Tired of spending countless mintues downsampling your data? Look no further!
In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
|
by: ryjfgjl |
last post by:
ExcelToDatabase: batch import excel into database automatically...
|
by: isladogs |
last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM).
In this month's session, we are pleased to welcome back...
|
by: Vimpel783 |
last post by:
Hello!
Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
|
by: PapaRatzi |
last post by:
Hello,
I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
|
by: CloudSolutions |
last post by:
Introduction:
For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
|
by: Shællîpôpï 09 |
last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
|
by: af34tf |
last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome former...
| |