Where should I style author name and date of comment?

If I’m understanding your question correctly.. you should be looking in comments.php rather than functions.php.

add the styling there.

Thanks rinse. Whereabouts? I tried styling:

<ol class="blog_post_wrap">
	<?php wp_list_comments(); ?>
</ol>

but again, nothing changed.

well for example here is an excerpt from my comments.php (note that not every theme’s comments.php looks the same)

<div class="comment-text">
<?php comment_text(); ?>
</div>

<div class="comment-meta">
 by <span class="comment-author"><?php comment_author_link() ?></span> on
<span class="comment-date"><?php comment_date('n/j/Y') ?> at <?php comment_date('g:ia') ?></span>
</div>

you are looking for comment_author_link and comment_date.

I’m using a custom function so that I could style my comments. Here’s the whole function, if it helps:

function advanced_comment($comment, $args, $depth) {
   $GLOBALS['comment'] = $comment; ?>

<li <?php comment_class(); ?> id="li-comment-<?php comment_ID() ?>">
<div class="comment_post_wrap">
   <div class="comment_post_left">
   <div class="comment_avatar">
     <a href="<?php the_author_meta( 'user_url'); ?>"><?php echo get_avatar($comment,$size='80',$default='/images/main/avatar.jpg' ); ?></a>
   </div>
       <a href="<?php the_author_meta( 'user_url'); ?>"><?php printf(__('%s'), get_comment_author_link()) ?></a><br />
       <?php printf(get_comment_date()) ?>
   </div>

     <?php if ($comment->comment_approved == '0') : ?>
       <em><?php _e('Your comment is awaiting moderation.') ?></em>
       <br />
     <?php endif; ?>

     <div class="blog_post_right">
         <?php comment_text() ?>
     </div>
     </div>
</li>
<div class="comment_divider"></div>
<?php } ?>

This is called from comments.php with:

<ol class="blog_post_wrap">
	<?php wp_list_comments('type=comment&callback=advanced_comment'); ?>
	</ol>

I have set size 12px in the css for the div class “comment_post_left” but the text just doesn’t seem to change size.

Wow duh. Sorry. It’s because I used “font:” instead of “font-size:” in the CSS.

ahh ok, well glad you figured it out.

Heh actually it’s still slightly unresolved. Although I’ve got the font size to change, the hyperlinks within the class seem to be getting overridden by the main a, a:hover and a:visited settings. I don’t understand this, don’t div classes usually override the main ones?

Here’s my main site CSS for hyperlinks:

a, a:visited, a:hover {
outline: none;
color: #333b3f;
}

And for this div:

.comment_post_left, a.comment_post_left:link, a.comment_post_left:hover, a.comment_post_left:visited {
position: relative;
height: auto;
width: 160px;
float: left;
margin: 10px 10px 0px 0px;
font-size: 12px;
color: #56636a;
line-height: 16px;
}

The font, div dimensions, line height, etc, are all working, but for some reason the font colour is #333b3f from the main CSS, above.

This issue is happening in the author link of the code below:

<div class="comment_post_left">
       <a href="<?php the_author_meta( 'user_url'); ?>"><?php printf(__('%s'), get_comment_author_link()) ?></a><br />
       <?php printf(get_comment_date()) ?>
   </div>

try

.comment_post_left a{
position: relative;
height: auto;
width: 160px;
float: left;
margin: 10px 10px 0px 0px;
font-size: 12px;
color: #56636a;
line-height: 16px;
}

Thanks dude, with your guidance I had a play around and came up with the working solution:

.comment_post_left {
position: relative;
height: auto;
width: 160px;
float: left;
margin: 10px 10px 0px 0px;
font-size: 12px;
color: #56636a;
line-height: 16px;
}

.comment_post_left a {
color: #56636a;
}

I guess it’s best to keep the “a” CSS separate from the div CSS.

oops my bad wasn’t thinking, yeah don’t put it all together like i did haha

anyway glad it’s working.