WordPress.org

Ready to get started?Download WordPress

Forums

CSS Help - Customizing <?php comment_text() ?> (2 posts)

  1. michaelclements
    Member
    Posted 5 years ago #

    I'm having trouble customizing the CSS for <?php comment_text() ?> in the comments field.
    Here's the link http://michaelclements.co.uk/2009/06/26/2095/
    Basically I want to pull the Author/time/date line and the actual comment closer together. I have tried to style it, with no luck...
    Here's the comments php
    <ol class="commentlist">
    <?php foreach ($comments as $comment) : ?>

    <li class="<?php echo $oddcomment; ?>" id="comment-<?php comment_ID() ?>">

    <div class="commentmetadata">
    <h4><?php comment_author_link() ?>. <?php _e('Posted ');?><?php if(!function_exists('how_long_ago')){comment_date() . ' at ' . comment_time(); } else { echo how_long_ago(get_comment_time('U')); } ?> <?php edit_comment_link('Edit Comment','',''); ?>
    <?php if ($comment->comment_approved == '0') : ?></h4>
    <?php _e('Your comment is awaiting moderation.'); ?>
    <?php endif; ?>
    </div>
    <?php comment_text() ?>

    <?php /* Changes every other comment to a different class */
    if ('alt' == $oddcomment) $oddcomment = '';
    else $oddcomment = 'alt';
    ?>

    <?php endforeach; /* end for each comment */ ?>

    and here's the comments CSS styling
    /* comments template */

    .comments-template{
    margin: 30px 0 0;
    padding: 0px 0 0;
    border-top: 0px solid #ccc;
    }

    .comments-template ol{
    margin: 0px 0 0;
    padding: 0px 0 0;
    list-style: none;
    }

    .comments-template ol li{
    margin: 20px 0 0px;
    padding: 0px 0 0px;
    border-bottom: 0px solid #ccc;
    }

    .comments-template h3, .comments-template h2{
    padding: 0px 0 0;
    }

    .commentmetadata{
    font-size: 12px;
    margin: 0px 0 0;
    padding: 0px 0 0;
    }

    /* end comments template */

    Any help????

  2. RGlover
    Member
    Posted 5 years ago #

    I would add the following style to your CSS:

    ol.commentlist li p {
       padding-top: 3px;
    }

    I arbitrarily picked 3px. Adjust that up or down as you see fit. Right now all of your paragraphs, by default, get 15px of top padding. This rule just specifically targets the paragraph tags in your comments section and re-adjusts that value.

Topic Closed

This topic has been closed to new replies.

About this Topic