• Resolved kmkoetsveld

    (@kmkoetsveld)


    I’ve a static homepage and my posts are showing on:

    https://www.versa.nu/agenda/

    As you can see there the titles of my posts are separated from the content of my post by a large white space. HOW/WHERE (a asume somewhere in the stylesheet?) can I reduce that space?

    Thanks in advance!

Viewing 11 replies - 1 through 11 (of 11 total)
  • You can alter your style sheet on line 490 (back up first):

    margin: 0 0 20px;

    to

    margin: 0 0 -25px;

    Or whatever you wish. But the reason for the large gap in the first place is that your ‘entry-meta’ div block is displaying but has no content. In Firebug the html is showing:

    <div class="entry-meta">
    <span class="meta-prep meta-prep-author">Posted on</span> <a rel="bookmark" title="12:54" href="https://www.versa.nu/geen-categorie/shekinah-festival-56-3-11/"><span class="entry-date">3 maart 2011</span></a> <span class="meta-sep">by</span> <span class="author vcard"><a title="View all posts by Karin Koetsveld" href="https://www.versa.nu/author/kmkoetsveld/" class="url fn n">Karin Koetsveld</a></span></div>

    But there is not output apart from the white space. The css margin fix will probably work in the short term though.

    Or you could add a new style rule to make it more specific:

    h2.entry-title {
    margin: 0 0 -25px;
    }

    I’m no css expert by any means but that should point you in the right direction.

    Thread Starter kmkoetsveld

    (@kmkoetsveld)

    Hi dgwyer,

    That worked wonderfull on the posts on the page named Agenda, but it also worked on my other pages (which don’t display post), with not quite the result I had in mind: https://www.versa.nu

    I tried it in h2 and h6, and both have the same result…. Any suggestions on how to have this code aply ONLY on posts (and search results, but NOT on pages)?

    THANKS!

    SEO_Goettingen

    (@seo_goettingen)

    I suggest you use firefox and use the Firebug addon. Just right click on whatever you want to change. Then it ll show you which styles are used and in which file you find them.

    For only on posts you might then have to give your post titles a different div container or style. You can edit this in – I hope I am correct – single.php

    Try:

    .post h2.entry-title {
    margin: 0 0 -25px;
    }

    That ‘should’ only alter h2 tags inside posts, and not on pages.

    Thread Starter kmkoetsveld

    (@kmkoetsveld)

    Thanks dgwyer! I had to try it on different locations, but this worked:

    #content h1,
    #content h2,
    #content h3,
    #content h4,
    #content h5,
    #content h6 {
    	font-size: 18px;
    	color: #3F2006;
    	line-height: 1.5em;
    }
    .post h2.entry-title {
    	margin: 0 0 -25px;
    }

    Thanks so much!

    Still like to do the same thing for my search results, since they still have the white space underneath the title: https://www.versa.nu/?s=energie

    Any suggestions on that? (I tried to insert .search-result h2 entry-title + a margin but that did noting. (You may not call yoursel a CSS expert, I’m a real newby ?? )

    Thanks so much!

    Michael

    (@alchymyth)

    .search-results might work;

    nothing to do with expert or not – simply read the body classes properly.

    either using one of these phantastic tools such as firebug; or by looking into the html code in your browser (‘view’ ‘source’)

    Thread Starter kmkoetsveld

    (@kmkoetsveld)

    YES!

    the s at the end of search-resultS did it!

    Only thing is it also applies to the error search result-page, which now looks like this: https://www.versa.nu/?s=mdnfjerbg

    Any idea about code to exclude the search-results error-page from this margin or give it its own margin?

    Thanks so much!

    Michael

    (@alchymyth)

    it is actually nor caused by the .search-results style, because the ‘not found’ search page has a different body class .search-no-results, but caused by:

    .post h2.entry-title {
    	margin: 0 0 -25px;
    }

    as .post is also the post class of the post div.
    (there is a possibly confusing overlap of body classes and post classes)

    change to:

    body.post h2.entry-title {
    	margin: 0 0 -25px;
    }
    Thread Starter kmkoetsveld

    (@kmkoetsveld)

    Yes, that works, but now I’m back to my original problem: a white space between my post-titles and post-content. It-s smaller than before, but stil quite big…

    https://www.versa.nu/agenda/

    Thanks so much for your help!

    Michael

    (@alchymyth)

    sorry, i didn’t follow this from the start;

    the front page has the body class .blog – therefore:

    body.blog h2.entry-title, body.post h2.entry-title {
    	margin: 0 0 -25px;
    }

    luckily you are not using any archive pages – or you might need to add further body classes ??

    Thread Starter kmkoetsveld

    (@kmkoetsveld)

    YES! You’re the best!

    Thanks so much! I’m learning, I do understand when you write it down like that, but generating code myself other than font sizes, margins and colors, is not happening yet ??

    So you saved me again!

    Thanks!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘How do I REDUCE the SPACE between my post-title and the content of my post?’ is closed to new replies.