WordPress.org

1. naturegirl321
   Member
   Posted 4 months ago #

   I'm trying to fix the spacing between the post title and the date. For example, http://tefl-tips.com/2012/01/great-resources-for-teaching-abroad/

   Could someone help me move the title down so it's not overlapping?
   Thanks

2. esmi
   Theme Diva & Forum Moderator
   Posted 4 months ago #

   Try using Firefox with the Firebug add-on for this kind of CSS work.
   http://getfirebug.com/

3. mburtis
   Member
   Posted 4 months ago #

   Try editing your theme's style.css with this:

   .singular article .entry-title {
   padding-top: 15px;
   }

   (The line you need to edit in style.css looks to be around line 2707)

   As esmi mentioned, the add-on for Firefox called Firebug is an awesoem tool for drilling down into your HTML/CSS and editing styles on-the-fly to find a fix.

4. naturegirl321
   Member
   Posted 4 months ago #

   I'll have to try Firebug. The padding 15px isn't working :(

5. naturegirl321
   Member
   Posted 4 months ago #

   And for some reason the date is above the title: I just don't get WP.

6. esmi
   Theme Diva & Forum Moderator
   Posted 4 months ago #

   There is nothing different about CSS in WordPress.

7. mburtis
   Member
   Posted 4 months ago #

   Did you edit style.css directly? I just took a look at your site again, and I'm not seeing the change reflected in your stylesheet. But perhaps you removed it?

   Are you using a child theme for this project? The list of css files seems to indicate that you are. If so, make sure you edit the style.css in your child theme directory (looks like it's /2011-child)

8. mburtis
   Member
   Posted 4 months ago #

   BTW,

   The reason the date is showing up above the title is because it has a "position: absolute" associated with it:

   .singular .entry-header .entry-meta {
   left: 0;
   position: absolute;
   }

   (from your child theme stylesheet)
   and

   .singular .entry-header .entry-meta {
   left: 0;
   position: absolute;
   top: 0;
   }

   (from the default twentyeleven stylesheet)

   This is actually what's causing all of your spacing problems. If you remove that position attribute, the spacing should be fine without adding the padding-top.

9. naturegirl321
   Member
   Posted 4 months ago #

   I'm using a child theme. I just switched from blogger, which uses html. CSS is a whole different ball game. Though I will say the support here at WP is much better than blogger.

   I've put this in

   .singular article .entry-title {
   padding-top: 15px;
   }

   as well as this

   .singular .entry-header .entry-meta {
   left: 0;
   position: absolute;
   }

   They're in my 2011 child templates in the style.css

   It's still not working. I'll try Firebug tomorrow. It's 1.30 am and I need to get some sleep.

Reply

You must log in to post.