Visited link color changes

Question

I have this class:

.news_item_info 
{
    font-size: .7em; 
    color:#000000; 
    text-indent: 30px;
    a:link { color: #000000; }
    a:visited { color: #000000; } 
}

Here its with code:

<div class="news_item_info">
    <?php echo $articles[$index]->getPoints(); ?> puntos por <span class="news_item_user"><a href="/index.php?action=user&param=<?php echo $articles[$index]->getUsername(); ?>">
    <?php echo $articles[$index]->getUsername(); ?></a> </span>
    <?php echo $articles[$index]->getElapsedDateTime(); ?> | <span class="comments_count"><a href="<?php echo "/index.php?action=comments&param=".$articles[$index]->getId(); ?>"><?php echo $articles[$index]->getNumberOfComments($articles[$index]->getId()); ?> comentarios</a></span>
</div>

The problem is that after I visit the user profile it shows as gray and I want to keep the black color.

If anyone knows the answer I will appreciate it.

Answer 1

The CSS posted is invalid, you have to qualify the styles by cascading definition. Try un-nesting your link definitions like so:

.news_item_info 
{
    font-size: .7em; 
    color:#000000; 
    text-indent: 30px;       
}

.news_item_info a:link { color: #000000; }
.news_item_info a:visited { color: #000000; }

Answer 2

You can't do CSS like that (nested blocks).

.news_item_info 
{
    font-size: .7em; 
    color:#000000; 
    text-indent: 30px;
}

.news_item_info a:link { color: #000000; }
.news_item_info a:visited { color: #000000; }

Answer 3

I would take the colour out into it's own rule.

.news_item_info 
{
    font-size: .7em; 
    text-indent: 30px;
}

.news_item_info, .news_item_info a:link, .news_item_info a:visited
{
    color: #000;
}

That way you only need to change the one thing if you ever want to change the colour.

alternatively, if you wanted all elements within the div.news_item_info element to be black, you could use this selector instead

.news_item_info, .news_item_info *