WordPress.org

Ready to get started?Download WordPress

Forums

How to get rid of space between title and content? (7 posts)

  1. piranhahotella
    Member
    Posted 7 years ago #

    Hi!

    I'm trying to edit the Kubrick theme so it looks exactly like my former website's design. Something I couldn't get rid of was the space between my post title and content. I'm using my old website's stylesheet. Here's my code:

    <p><span class="newsItemHeader"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></span>
    <?php the_content('Read the rest of this entry &raquo;'); ?>
    <span class="newsItemFooter">Posted on <?php the_time('F jS, Y - H:i') ?> - <?php comments_popup_link('No Comments »', '1 Comment »', '% Comments »'); ?></span></p>

    and it looks like this:

    POST HEADER (title)

    POST CONTENT (Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin nisi nisl, pulvinar ac, pellentesque quis, posuere pharetra, tellus. Proin aliquam congue arcu. Quisque dapibus magna ut dolor. Nam quis quam id massa viverra laoreet. Sed ultricies, etc.)

    POST FOOTER (posted on 'date' - 'time' - 'comments')

    The problem is I can't figure out how to get rid of the spaces between header, content and footer. Help? Thanks! :)

  2. piranhahotella
    Member
    Posted 7 years ago #

    By the way:

    1. I use the newsItemHeader and newsItemFooter classes to format the text.
    2. Removing the <span> tags doesn't solve the problem.
  3. Marcel Brinkkemper
    Member
    Posted 7 years ago #

    Have you examined style.css?
    By the way, with only this code it's hard to say what element is causing the space. Do you have a link to your site so we can have a look?

  4. piranhahotella
    Member
    Posted 7 years ago #

    Hey macbrink, thank for your reply!

    I'm currently developing my WordPress blog locally, but I have some screenshots to show what I mean:

    Original theme
    WordPress theme

    (note: don't mention the sidebar, I'm still working on it...)

    Part of my HTML code for the original theme:

    <div id="content-sidebar">
    
      <div id="content">
        <h2><img src="1home_news.jpg" alt="news" name="news"
     id="news" /></h2>
        <span class="newsItemHeader">Goodbye Oh Five</span>
        2006 will be the year you'll be hearing a lot more
    from Piranha Hotella.
        To 'celebrate' the new year, a brand new song was
    recorded and put online. The song is called "An Almost
    Pleasurable Sensation Of Fright (aka Goodbye Oh Five)"
    and can be downloaded from the <a href="#">Media section
    </a>. Or you can <a href="#">read the lyrics</a>.
        Piranha Hotella is now a MySpace Music member.
    Visit us at <a href="#">www.myspace.com/piranhahotella</a>.
        <span class="newsItemFooter">posted on: January 5th, 2006 - 8:31 am - <a href="#">Comments (16)</a></span>

    And part of my wordpress code:

    <div id="content-sidebar">
    
    		<div id="content">
    
    			<?php if (have_posts()) : ?>
    
                    <?php while (have_posts()) : the_post(); ?>
    
                        <div id="post-<?php the_ID(); ?>">
                            <span class="newsItemHeader"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></span>
    						<?php the_content('Read the rest of this entry &raquo;'); ?>
    	                    <span class="newsItemFooter">Posted on <?php the_time('F jS, Y - H:i') ?> - <?php comments_popup_link('No Comments »', '1 Comment »', '% Comments »'); ?></span>
    
                        </div>
    
                    <?php endwhile; ?>

    I replaced the existing style.css by my original css file, and since it's not too big here's the code:

    body {
    	width: 518px;
    	margin-top: 0px;
    	margin-right: auto;
    	margin-bottom: 0px;
    	margin-left: auto;
    	text-align: justify;
    	background-color: #FFFFFF;
    }
    body,td,th {
    	font-family: Georgia, "Times New Roman", Times, serif;
    	font-size: 12px;
    	color: #000000;
    }
    a:link {
    	color: #000000;
    }
    a:visited {
    	color: #000000;
    }
    a:hover {
    	color: #937955;
    }
    a:active {
    	color: #000000;
    }
    #header {
    	width: 518px;
    }
    #content-sidebar {
    	width: 518px;
    }
    #content-sidebar #content {
    	width: 318px;
    	float: left;
    }
    .newsItemHeader {
    	font-weight: bold;
    	text-transform: uppercase;
    }
    .newsItemFooter {
    	font-size: 10px;
    }
    #content-sidebar #sidebar {
    	width: 200px;
    	float: right;
    	text-align: right;
    }
    #footer {
    	width: 518px;
    	clear: both;
    }

    Alright. That's a lot of code for one little problem, but I just want this to work. Any ideas how to fix this? Thanks again!

    (edit: sorry for the scrollbars :( )

  5. Marcel Brinkkemper
    Member
    Posted 7 years ago #

    i would suggest to change the post-title element from an inline <span> to a <h2> element and set margin to 0px.

  6. piranhahotella
    Member
    Posted 7 years ago #

    Thanks for the reply, but unfortunately that doesn't solve the problem. It almost looks like the the_title() function has the space built-in.
    Any other ideas on how to fix this? Thanks a lot, again!

  7. gatorgse
    Member
    Posted 7 years ago #

    How would *i get rid of this code between sidebar and end wrapper? I'm new and don't know how it got there and don't know how to edit it out. The page is located at http://www.yourcruiseyourway.com/wordpress. This code shows up when I run the xhtml validator as errors, but doesn't appear when I view source. Any idaes?? Thanks.

    '<!-- End Sidebar -->
    <script type="text/javascript" language="javascript"> var sc_counter=1469848; var sc_project=2511135; var sc_invisible=0; var sc_partition=24; var sc_security="30734c7d"; </script> <script type="text/javascript" language="javascript" src="http://www.statcounter.com/counter/counter.js"></script><noscript>online kasino<img src="http://c25.statcounter.com/counter.php? sc_project=2511135&java=0&security=30734c7d&invisible=0" border="0"></noscript>

    </div></div><!-- End pagewrapper and page classes -->

    </div><!-- End container id -->

    </body>
    </html>'

Topic Closed

This topic has been closed to new replies.

About this Topic