Can't stop link from inheriting traits

This is a discussion on "Can't stop link from inheriting traits" within the Web Page Design section. This forum, and the thread "Can't stop link from inheriting traits are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices




Reply
 
LinkBack Thread Tools
  #1  
Old May 10th, 2008, 18:13
CloudedVision's Avatar
Moderator
Join Date: Feb 2008
Location: In My Own Little World
Age: 14
Posts: 1,275
Blog Entries: 9
Thanks: 2
Thanked 40 Times in 40 Posts
Can't stop link from inheriting traits

My navigation is contained in a div with the id #nav. I stylize the links like so:

Code: Select all
#nav a,
#nav a:link,
#nav a:visited,
#nav a:active {
    padding:0 0 0 5px;
    border-left:#FF0000 3px solid;
    color:#000000;
    text-decoration:none;
    display:block;
    width:100px;
}

#nav a:hover {
    background:#FFCC99;
    color:#000000;
}
Pretty simple, and it works. But I also have an image link the I don't want inheriting all those traits thats in the #nav div. So I write a CSS class to override the #nav links. It's like this:

Code: Select all
#otherroad,
#otherroad:link,
#otherroad:visited,
#otherroad:active,
#otherroad:hover {
    background:none;
    color:#000;
    text-decoration:none;
    border:none;
}
And I write the link like this:

HTML: Select all
<a href="http://www.otherroaddesign.com/" id="otherroad"><img src="/assets/images/otherroaddesign.gif" alt="Designed Pro Bono By Other Road Design" /></a>
It should work, right? But for some reason it still inherits the properties from #nav, and ignores the override. Why is it doing this?

You can view the full page here.
__________________
Web Design And Development: Other Road Design | Problems with IE6?: KApp | My Blog: Only Nerds Allowed | Learning PHP? Lessons
Last Blog Entry: Hilarious Rapper (Jul 29th, 2008)

Last edited by CloudedVision; May 10th, 2008 at 18:30.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old May 10th, 2008, 18:57
frinkky's Avatar
Super Moderator
Join Date: Oct 2006
Location: Southampton
Age: 30
Posts: 351
Blog Entries: 2
Thanks: 2
Thanked 6 Times in 6 Posts
Re: Can't stop link from inheriting traits

it'd be #otherroad a:link, #otherroad a:visited etc.

To get rid of borders around image links i just stick this ner the top of my css file to remove all:

Code: Select all
a img {
border:none;
}
Last Blog Entry: Fobriwap! (Mar 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old May 10th, 2008, 19:01
CloudedVision's Avatar
Moderator
Join Date: Feb 2008
Location: In My Own Little World
Age: 14
Posts: 1,275
Blog Entries: 9
Thanks: 2
Thanked 40 Times in 40 Posts
Re: Can't stop link from inheriting traits

its not the image border links I'm worried about, I've already taken care of that. It's that #otherroad seems to be overridden by #nav, even though it should be exactly the opposit way around.
__________________
Web Design And Development: Other Road Design | Problems with IE6?: KApp | My Blog: Only Nerds Allowed | Learning PHP? Lessons
Last Blog Entry: Hilarious Rapper (Jul 29th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old May 10th, 2008, 19:20
CloudedVision's Avatar
Moderator
Join Date: Feb 2008
Location: In My Own Little World
Age: 14
Posts: 1,275
Blog Entries: 9
Thanks: 2
Thanked 40 Times in 40 Posts
Re: Can't stop link from inheriting traits

fixed it using !important. still don't know why it inherited styles like that.....
__________________
Web Design And Development: Other Road Design | Problems with IE6?: KApp | My Blog: Only Nerds Allowed | Learning PHP? Lessons
Last Blog Entry: Hilarious Rapper (Jul 29th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #5  
Old May 10th, 2008, 20:32
frinkky's Avatar
Super Moderator
Join Date: Oct 2006
Location: Southampton
Age: 30
Posts: 351
Blog Entries: 2
Thanks: 2
Thanked 6 Times in 6 Posts
Re: Can't stop link from inheriting traits

Sorry, must have misundertood you
Last Blog Entry: Fobriwap! (Mar 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #6  
Old May 12th, 2008, 01:57
Elite Veteran
Join Date: Aug 2005
Location: That Place
Posts: 2,044
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Re: Can't stop link from inheriting traits

#nav li a img {} or something like #nav li#foo a {} whatever, you just need to correctly target it.
__________________

Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Music on/Off (does not stop in IE7) Need Help! Webill JavaScript Forum 2 May 11th, 2008 11:27
Go to Stop issue acrikey Flash & Multimedia Forum 1 Dec 1st, 2007 23:48
How do I stop it scrolling to the top? marksk Web Page Design 2 Jul 26th, 2007 20:32
Stop Cyberbullying pa007 Webforumz Cafe 11 Apr 3rd, 2007 04:47
How to Stop Robots Gee Bee Web Page Design 4 Jan 26th, 2006 18:56


All times are GMT. The time now is 20:29.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved