why can’t i change the link color in my twitter feed

[stray]

i just posted up my new portfolio site. But i have 2 problems in IE for some reason the content boxes have an extra bit at the bottom and i have no idea why i can’t change the color of the hyperlinks in my twitter feed which is starting to really annoy me can anyone help?

[chazzwick]

post a link to your site, or you code, or we wont be able to help

[stray]

ermm sorry about that thought i actually put the site up. well anyway the site is http://www.stray-designs.com

[falkencreative]

In line 15 of your css file, you have styled all of your links like this:

a:link {
color:#000000;
font-weight:bold;
text-decoration:none; }

If you want to style just the twitter links, add "#twitter_update_list" before the "a:link" like this (I’d suggest making a new line in your CSS for this, rather than replacing the existing line. Make sure it is after the "a:link" line.)

#twitter_update_list a:link {}

Remember links have five states: a:link, a:visited, a:hover, a:active, and a:focus

[stray]

k well i tried the ie fix that was suggeted and it didn’t do anything and i haven’t got a clue how to fix it been looking for a few days and can’t see the problem.

now for changing the link color of the twitter feed, i should put

in the css file, after the a:link stuff i had near the top
#twitter_update_list a:link {
color:#000000; <<<<i want to change the link on the twitter feed to black and leave the normal nav white
font-weight:bold;
text-decoration:none;
}
not sure if thats right

and in the html i should
have another div of
<div id="twitter_update_list a:link" </div> <<<<< should this surround all the other twitter divs and the java code?

thanks for the help already guys i’m just out of ideas by myself here

[falkencreative]

"stray" wrote:

k well i tried the ie fix that was suggeted and it didn’t do anything and i haven’t got a clue how to fix it been looking for a few days and can’t see the problem.

now for changing the link color of the twitter feed, i should put

in the css file, after the a:link stuff i had near the top
#twitter_update_list a:link {
color:#000000; <<<<i want to change the link on the twitter feed to black and leave the normal nav white
font-weight:bold;
text-decoration:none;
}
not sure if thats right

Correct. Just update the color to whatever color you want. Be aware that there are other states for the links other than :link (visited/hover/active/focus) which you may need to set as well. For example, to apply styling to visited links, you would use:

#twitter_update_list a:visited {}

"stray" wrote:

and in the html i should
have another div of
<div id="twitter_update_list a:link" </div> <<<<< should this surround all the other twitter divs and the java code?

No need to do that. All the above CSS code does is select all a:links within the div "twitter_update_list" and apply the correct styling. Adding the CSS is all you need to do.

[stray]

this is getting really annoying now i’ve tried what you suggested and its not working heres the code of the twitter i put in my css

this is the styling for all links

Code:

a:link {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #FFFFFF;
}
a:visited {
text-decoration: none;
font-weight: bold;
background-color: none:;
color: #FFFFFF;
}
a:hover {
text-decoration: none;
font-weight: bold;
background-color: none:
color: #FFFFFF;
}
a:active {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #FFFFFF;
}
a:focus {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #FFFFFF;
}

and this is the code that i put further down my css file

Code:

#twitter_update_list a:link {

a:link {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
a:visited {
text-decoration: none;
font-weight: bold;
background-color: none:;
color: #000000;
}
a:hover {
text-decoration: none;
font-weight: bold;
background-color: none:
color: #000000;
}
a:active {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
a:focus {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
}

i must be blind or something i can’t find the problem

[falkencreative]

Quote:

#twitter_update_list a:link {

a:link {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
a:visited {
text-decoration: none;
font-weight: bold;
background-color: none:;
color: #000000;
}
a:hover {
text-decoration: none;
font-weight: bold;
background-color: none:
color: #000000;
}
a:active {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
a:focus {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
}

You can’t nest CSS like this. Try this instead:

Code:

#twitter_update_list a:link {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
#twitter_update_list a:visited {
text-decoration: none;
font-weight: bold;
background-color: none:;
color: #000000;
}
#twitter_update_list a:hover {
text-decoration: none;
font-weight: bold;
background-color: none:
color: #000000;
}
#twitter_update_list a:active {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}
#twitter_update_list a:focus {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}

[falkencreative]

I should also mention, if you are using the same styles for several elements, you can combine it like this:

#twitter_update_list a:link, #twitter_update_list a:visited, #twitter_update_list a:hover, #twitter_update_list a:active, #twitter_update_list a:focus {
text-decoration: none;
font-weight: bold;
background-color: none;
color: #000000;
}

To be clear:

a:link styles a regular link
a:visited styles links that the user has already clicked on
a:hover styles links that the users is hovering over
a:active styles links in the moment when the user clicks on it
a:focus styles links when the link has focus (when the user tabs over to it using the keyboard)

[stray]

thanks very much mate and for the little lesson :)

k i’ve been trying to get the ie error fixed by changing the padding and it doesn’t work. in ie the background for the text repeats past the bottom image of the div and i have no idea how to fix it. in FF it looks perfect but in IE i have no idea what could be causing it

[Author]

Posts