CSS Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed Forums > Web Design > CSS Help
Reload this Page

CSS question

Discuss CSS question in the CSS Help forum on Dev Shed.
CSS question Cascading Style Sheets (CSS) forum discussing all levels of CSS, including CSS1, CSS2 and CSS Positioning. CSS provides a robust way of applying standardized design concepts to your web pages.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old July 22nd, 2003, 05:51 PM
royrubin royrubin is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Mar 2003
Posts: 56 royrubin User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 10 m 26 sec
Reputation Power: 6
CSS question
Hello,

I have a string embedded within h1 tags (which I would like to keep as is) that has a link for one of the words. The link takes on a different style (as defined in the stylesheet) than the rest of the string. Is there anyway to cancel all styles for that particular link, so that it stays within the same style as the h1 tag? Please keep in mind, that I can't change the default anchor class.

Any help will be appreciated.

Thanks.

-R

<style>
a { font : normal 8pt Verdana; color : #000000; text-decoration:underline; }
a:hover { font : normal 8pt Verdana; color : #993300; text-decoration:none; }
a.bold { font : bold 8pt Verdana; color : #000000; text-decoration:underline; }
a:hover.bold { font : bold 8pt Verdana; color : #626B21; text-decoration:none; }
a.test:link {}
a.test:visited {}
a.test:active {}
a.test:hover {}
</style>

<h1>this is a <a href="#" class="test">sample</a> test</h1>
Reply With Quote
  #2  
Old July 22nd, 2003, 06:23 PM
meddle's Avatar
meddle meddle is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Dec 2002
Location: Barcelona
Posts: 133 meddle User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Code:
<style>
a { font : normal 8pt Verdana; color : #000000; text-decoration:underline; }
a:hover { font : normal 8pt Verdana; color : #993300; text-decoration:none; }
h1, h1 a, h1 a:hover {font:normal 15pt Verdana; color : green;}
h1 a {text-decoration:none;}
</style>
<h1>this is a <a href="#">sample</a> test</h1>
<p>this is another, normal <a href="#">link</a> test</p>
Reply With Quote
  #3  
Old July 22nd, 2003, 06:26 PM
royrubin royrubin is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Mar 2003
Posts: 56 royrubin User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 10 m 26 sec
Reputation Power: 6
I would like to keep the h1 as is, without adding a class.

Any ideas?
Reply With Quote
  #4  
Old July 22nd, 2003, 06:39 PM
meddle's Avatar
meddle meddle is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Dec 2002
Location: Barcelona
Posts: 133 meddle User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
there is NO class in my code
Reply With Quote
  #5  
Old July 22nd, 2003, 08:24 PM
polik polik is offline
Junior Member
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2003
Posts: 14 polik User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
It should work this way...

Code:
h1 a, h1 a:hover {font-size: inherit; font-family: inherit}


It works fine in Mozilla or Opera, but no version of IE accepts this. Not even IE6 with standards-compliant mode turned on.
But, in IE5+, it could be done this way:

Code:
h1 a, h1 a:hover {
    font-size: expression(document.getElementsByTagName('h1')[0].currentStyle.fontSize);
    font-size: inherit;
    font-family: expression(document.getElementsByTagName('h1')[0].currentStyle.fontFamily);
    font-family: inherit;
}


IE: expression() is OK, but 'inherit' is unknown and thus ignored
Other browsers: expression() is unknown and thus ignored, but inherit is OK.

I thought that it might cause a JS error when there is no H1 element in the page, but it didn't.
Last edited by polik : July 22nd, 2003 at 08:28 PM.
Reply With Quote
  #6  
Old July 23rd, 2003, 04:25 AM
meddle's Avatar
meddle meddle is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Dec 2002
Location: Barcelona
Posts: 133 meddle User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
you obviously DIDNT try my code above, it even works for IE and Mozilla and does exactly what royrubin was asking for.
Reply With Quote
  #7  
Old July 23rd, 2003, 08:12 AM
polik polik is offline
Junior Member
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2003
Posts: 14 polik User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
I thought that he didn't want to change users definition of h1...
Last edited by polik : July 23rd, 2003 at 08:15 AM.
Reply With Quote
  #8  
Old July 23rd, 2003, 08:27 AM
meddle's Avatar
meddle meddle is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Dec 2002
Location: Barcelona
Posts: 133 meddle User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
"Is there anyway to cancel all styles for that particular link, so that it stays within the same style as the h1 tag?"
The only way is redefining them to the same style values of h1.
Reply With Quote
  #9  
Old July 23rd, 2003, 08:35 AM
polik polik is offline
Junior Member
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2003
Posts: 14 polik User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 0
Yes, that's right. That's what both my and your code does.
But, your one also defines h1.
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > CSS Help > CSS question

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 3 hosted by Hostway.