eGriffinWebDesign

Very glad you got it worked out teejay!!! ??

Michael

teejay,

I am really perplexed as to why these css coding changes don’t seem to be working for you. Are you using any caching plugins like W3 Total Cache or Super Cache? Examining your source code it doesn’t look like it but it is worth asking.

Thanks,

Michael

Sorry teejay . . . my mistake. Try this instead.

#comments {
width: 960px;
margin: 0 auto;
padding: 10px 0 0 0;
}

You should be able to omit the #reply-title css if the above works.

Hey teejay,

Try the following css code and let me know if it does the trick . . .

#comments {
width: 100%;
margin: auto;
}

#reply-title {
margin-left: 10px;
}

Hey teejay111,

Make a copy of that file and put it into your child theme folder. Then try moving the comments code after the content section like this

<?php get_header(); ?>
  <section id="content" class="clearfix">
    <?php render_page('page'); ?>
  </section>
<?php comments_template(); ?>
<?php get_footer(); ?>

and let me know if that works. If it does there will probably be some minor css to be added to get it all to look just right, but let me know if that moves the Leave A Reply text to the right place and then we will address the styling.

Thanks,

Michael

Hmmmm . . . okay so that route doesn’t seem to be working for whatever reason. I looked closer and it seems like the issue may be that the comments section is included with the main content instead of being added after it. While the css code I gave you should work, since it doesn’t we can try another option.

Can you post the page template you are using for the Home page? And if possible post the contents of that template via pastebin? I should be able to tell you how to rearrange the code so that the comments are outside of the main content area and therefore the Leave a Reply will appear where it is supposed to.

Thanks,

Michael

Hey teejay111,

Looking at your css it doesn’t appear that it should matter much where you put the css code, but you can try it just above line 343 where the footer css starts.

I am wondering now if there is another css file for the Jetpack plugin that is overriding your child theme style.css (It looks like you are using Jetpack for your commenting system – if I am wrong let me know). I have not used Jetpack myself so I cannot check to see what files are included. I would tell you to look under plugins>Jetpack>css or something along those lines and see if there is anything in there giving styling instruction to #comments.

Let me know if you can find anything like that.

Thanks,

Michael

Can you put a copy of the style.css you are using? Use https://pastebin.com/ to post the entire document. That should help me pinpoint where you want to place it.

Thanks,

Michael

Hmmmm . . . try it with !important at the end, as in

#comments {
clear: both!important;
}

As long as you add it to your style.css document in the part that applies to all sizes (i.e. not under a media query) it should work. So above the first media query (i.e. @media screen and (max-width: XXXpx) {) should work. Let me know if moving it up does not change anything.

Thanks,

Michael

Hello teejay111,

Adding

#comments {
clear: both;
}

seemed to fix it for me. Try adding that to your style.css and see if that fixes it for you.

Thanks,

Michael

Awesome Ross!!! I am really glad we were able to get this sorted out for you. Believe me when I say that your thanks is more than enough reward. I believe that WordPress is a phenomenal web design platform, and I am happy to help people understand better how to use it. The fact that you learned some things along the way to make future projects a little easier is icing on the cake! A virtual toast between us then, but drink responsibly ??

I check these forums as often as possible, but if you have any future issues feel free to contact me directly via my website to let me know that you have posted a new topic and I will be happy to jump on and help in any way that I can.

Cheers!!!

Michael

Hey demonboy,

This is not the most elegant solution, but it looks like it might work for what you want to do without having to deal with NextGen Gallery or any other plugin.

Possible Solution

Hope this helps,

Michael

Hey Ross,

Actually in looking at your site again I think the problem is a simple miscommunication . . . I see that other pages on your site have the footers at the bottom, just not necessarily the front page which is where I was looking initially because we were talking about the front-page.php template file.

So the code to center the headers is as follows:

.first.front-widgets .widget_text h3 {
text-align: center;
}

But then it looks like the two footers are different sizes. To fix that you can try the following CSS code:

.template-front-page .widget-area .widget, .template-front-page .widget-area .widget:nth-child(even) {
width:45%!important;
}

.first.front-widgets .textwidget {
margin-left: 10%;
}

I think that should do what you want it to do. Let me know if that does the trick!

Cheers!

Michael

Excellent Ross! It is usually the simplest solutions that work the best! I am confused though . . . when I look at your website now the widgets are on the right-hand side in a sidebar as opposed to in the footer. Is that where you wanted them? Just let me know for sure and I will tell you what to target to center the titles.

Cheers!

Michael