Grow your CSS skills. Land your dream job.

WordPress Comments area misbehaving

  • # March 31, 2013 at 10:47 pm

    I’ve got to the comments section in the BLANK Theme and there’s a div that I cannot identify that’s pushing my sidebar down, see here:

    http://www.dropbox.com/s/86y9b84qmaimg1g/problem.png

    When I outline it with Google’s Developer tools, I see it, but when I inspect it, it comes back as the HTML tag??? The h2 in the top of the post is floated left and I zeroed out its margin and padding. Same with the meta content beneath it.

    Here’s the theme as it is now:

    https://www.dropbox.com/s/ifxj9ngqsdfzdz7/BLANK-Theme.zip

    Everything else is working except this comments section. Any advice would be much appreciated.

    # April 1, 2013 at 12:49 pm

    Well, any ideas?

    # April 1, 2013 at 8:47 pm

    If you had a link, could tell you in a few seconds. Looks like a float issue.

    # April 2, 2013 at 9:36 am

    Did the links above not work? I’m hoping to resolve the issue before I push the template to WordPress.

    # April 2, 2013 at 9:53 am

    It’s really hard to tell with out an actual link to the site to debug. but, as @noahgelman said it looks like a float issue. I would try to put a float: right; on the sidebar container and float: left; on the comments container.

    # April 2, 2013 at 1:30 pm

    Here’s the stylesheet in Codepen: [http://cdpn.io/nkbay](http://cdpn.io/nkbay “Codepen Sample”) I am floating the comments to the left and the aside to the right. There’s some other element that is pushing the aside down, as you can see in the screen shot.

    # April 2, 2013 at 2:27 pm

    That pen is sort of worthless. It would take about five seconds if you provided us a link to the theme actually in action.

    # April 2, 2013 at 4:18 pm

    OK, I’ll put the theme up in WP and see how it goes. Then I’ll send a link.

    # April 2, 2013 at 4:22 pm

    Here’s the link to the WP blog with the theme in action. http://blog.lemieux-design.net/ Now the aside is missing.

    # April 2, 2013 at 4:30 pm

    For starters: quite a few errors happening here: http://cl.ly/image/3o2o0q051U3h

    I would wrap all of your posts in a div call `.posts` or something like that, then float *that* to the left.

    # April 2, 2013 at 4:48 pm

    I’ll fix the errors, seems like some paths to the fonts are wrong. In terms of your suggestion, which files do I put that in? Header and footer or content? I thought it was just the comments.php file screwing things up.

    # April 3, 2013 at 1:58 pm

    I got it to work. It was the index.php file that needed attention. Thanks for all your help.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".