Comment Styling…

  • Resolved artsyandi

    (@artsyandi)


    15 years ago

    I am having a lot of trouble styling the Comments section of my theme (most of which is WP Premium with some bits and pieces from Zinepress)

    To get an idea of what I am talking about first, the page is here:
    http://www.andiosiek.com/?p=53&replytocom=13#comment-14

    I would like the Author link to be Bolded and different colors, the Date/time stamp to be smaller and directly under the Author’s name, the comment to stretch the full width of the box, and the Reply button to be different colors.

    I understand quite a bit of editing PHP but I can’t figure out the individual CSS rules for these sections. Can someone please point me in the right direction… at least to get me started?

    Here is the code for the comments:

    [code moderated according to forum rules - please use the pastebin]

    And here is my CSS stylesheet... warning... it's a mess and needs cleaned up... probably part of my problem...

    [CSS code moderated - the link to your site is sufficient to access the stylesheet]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Chip Bennett

    (@chipbennett)

    15 years ago

    You should put in a Pastebin any code over about 10 lines, and then link to the Pastebin here in the support topic.

    lockettpots

    (@lockettpots)

    15 years ago

    To make the author link bold find this in the style.css file

    #content .commentlist li a {
    font-weight: normal;
}

    and change the font-weight to bold

    The css rule for the date/time is here

    #content .commentlist li .comment-meta a {
    color: #666666;
    font-size: 11px;
    text-transform: uppercase;
}

    This should get you started

    Thread Starter artsyandi

    (@artsyandi)

    15 years ago

    Thanks so much!

    Thread Starter artsyandi

    (@artsyandi)

    15 years ago

    That helped some… and I am a lot furthur than I was. An example page is here:

    http://www.andiosiek.com/?p=53#comments

    Now what I would like to do is shorted the width of the comment text itself in each reply, and shift it up a bit so that it is directly under the meta date/time information. It is close at this point… but I want it to fit alongside the avatar box.

    Then, I would like to change the font of the reply button.

    Any more suggestions as to what css rule would be affected for these two changes? I’ve been messing with this all day and I know it shouldn’t be this difficult.

    Let me know if there is any information you need to help with this.

    lockettpots

    (@lockettpots)

    15 years ago

    negative margins can be a useful technique

    try

    #content .commentlist p {
    font-weight: normal;
    margin-top: -15px;
    text-transform: none;
    width: 200px;
}

    just tweak these values to suit what you want

    lockettpots

    (@lockettpots)

    15 years ago

    To change the font of the reply button

    #content .commentlist li .reply {
    font-family: georgia, serif;
    font-size: 10px;
    text-decoration: none;
}

    You can alter the font size.
    I’ve also added a font-family rule if you want to change the type of font

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Comment Styling…’ is closed to new replies.