How to fix double-lined headers?

  • Unknown's avatar

    I have customized my design at http://thefloodzine.com, but whenever I have a header subject line that is two lines long, it doesn’t push down the rest of the post but instead is displayed behind it. Is there a way to fix this only for double-lined headers and not just single-lined headers or do I have to do the same code for both? Either way, what is the correct code to move down the content of the post? Thanks so much! Here’s an example if it will help of a post that is scheduled for tomorrow: http://thefloodzine.com/2012/02/14/fashion-photography-butterfly-caught/
    Blog url: http://ledeluge.wordpress.com/

  • This is one of those oddities when using custom fonts. The theme is only designed to offer space for the default fonts, it can’t accommodate all fonts and sizes.

    Do you have any luck if you bump the size of that font down a notch?

  • Unknown's avatar

    Thanks for your reply! The only thing is that it seems like the fonts are smaller on the front page than they are when you click directly into the post. It seems like I would only need to go down by one point size on the front page, but maybe up to three on the inside pages where there is no sidebar. Is there a way to specify these particular changes with a code?

  • Yes, that is true. Within the theme, it is set for the single post title to be a few points larger than it is on the main page. This affects any font that you use.

  • Unknown's avatar

    Okay, so then it would be adjusted automatically on the inside pages once I change the size on the front then, it sounds like? I’m sorry, but how do I actually go about making the headers smaller on the front page? I only know very basic CSS and I tried a few different codes I thought would work but they do not seem to have any effect in the CSS. Thanks for your help – I really appreciate it.

  • Yeah, it should work automatically. Try dropping it down just a notch via the custom fonts interface. It should work out.

  • Unknown's avatar

    For some reason, when I try use the standard way of editing fonts it just doesn’t work. Nothing I do changes anything, but when I do try to change something, it just changes it to a standard serif font. Is there a CSS code I can use to make the heading smaller instead? I tried “font-size:” under the h1 part, but it didn’t change, and I don’t see a way to do it through my TypeKit settings.

  • Unknown's avatar

    If you’d like to edit the font size via your CSS editor, you can change the size for the post titles by using this CSS snippet:

    h1.entry-title{
    font-size: 1em;
    }

    You can change the number to display the font as small as you’d like. If you need any additional help, let us know :)

  • Unknown's avatar

    Thank you! That does change the font size on the front page, but not on the click-through page. The problem is that I think the font on the front page is perfect as-is, but is there anyway to specifically target that click-through page header? Or just make it so that it doesn’t get bigger and just stays the same as the one on the front?

  • Unknown's avatar

    My apologies! To fix that, you’ll want to replace h1.entry-title with .singular .entry-title instead. The rest of the code will be the same :)

  • Unknown's avatar

    Ahh, perfect! Thank you so much for your help!

  • The topic ‘How to fix double-lined headers?’ is closed to new replies.