CSS Comments Huge Gap

Discussion in 'WordPress' started by wompninja, Jun 30, 2010.

  1. #1
    I am trying to use Disqus or Intense Debate for my comments but I have a very strange problem happening. Once one of the plugins is loaded and working there is a huge space in between the content and the comments section. I cannot seem to find the css that is causing the problem and it's obviously my theme's fault because it is happening with two different comment systems. Please help me straighten this out. The site is at

    http://www.fluid-studio.net/jes/blog/2010/06/red-butte-concerts-on-track/
     
    wompninja, Jun 30, 2010 IP
  2. Cash Nebula

    Cash Nebula Peon

    Messages:
    1,197
    Likes Received:
    67
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Yeah, that is a strange one. WebDeveloper is showing a frame with a Facebook error page in there, maybe that is the problem. It says:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>Login Status</title>
    </head>
      <body>
        <script type="text/javascript">
          document.domain = "facebook.com";
        </script><div id="error" class="UIMessageBox error"><h2 class="main_message" id="standard_error">Invalid Argument</h2><p class="sub_message" id="standard_explanation">The Facebook Connect cross-domain receiver URL (http://static.ak.fbcdn.net/connect/xd_proxy.php#?=&amp;cb=f1471e71ca91574&amp;origin=http%3A%2F%2Fwww.fluid-studio.net%2Ff1c47618886fa9&amp;relation=parent&amp;transport=postmessage&amp;frame=fa05773a62ca3a&amp;result=xxRESULTTOKENxx) must have the application's Connect URL () as a prefix.  You can configure the Connect URL in the <a href="http://www.facebook.com/developers/editapp.php?app_id=131720230182717">Application Settings Editor</a>.</p></div></body></html>
    
    Code (markup):
     
    Cash Nebula, Jun 30, 2010 IP
  3. hmansfield

    hmansfield Guest

    Messages:
    7,904
    Likes Received:
    298
    Best Answers:
    0
    Trophy Points:
    280
    #3
    Remove of deactivate the Facebook connect plug in and see what happens and then go from there. Sometimes 2 different javascript sources will cause issues like that.
     
    hmansfield, Jun 30, 2010 IP
  4. wompninja

    wompninja Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I don't have a facebook connect plugin. The Disqus plugin has a facebook login option but it doesn't do anything when I turn it on and off. Intense debate does the same thing.
     
    wompninja, Jun 30, 2010 IP
  5. wompninja

    wompninja Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I also disabled every other plugin and I still get the problem.
     
    wompninja, Jun 30, 2010 IP
  6. hmansfield

    hmansfield Guest

    Messages:
    7,904
    Likes Received:
    298
    Best Answers:
    0
    Trophy Points:
    280
    #6
    That's a tough one. Something is interfering with the plug ins java script. Is it the latest version as well as the latest version of WP?
    Are all of your other plug ins up to date?
     
    hmansfield, Jun 30, 2010 IP
  7. wompninja

    wompninja Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    everything is up to date
     
    wompninja, Jun 30, 2010 IP
  8. hmansfield

    hmansfield Guest

    Messages:
    7,904
    Likes Received:
    298
    Best Answers:
    0
    Trophy Points:
    280
    #8
    I don't know. If it were me I would be opening my themes single.php. comments.php, index.php and checking my CSS file to see if there is any code there that warrants the spacing.
    I know that may not be something that you are good at or else you would have probably done it already, but it's just really hard to say what the problem is on the outside looking in.
     
    hmansfield, Jun 30, 2010 IP
  9. wompninja

    wompninja Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #9
    I have checked all of those but maybe there is something I am missing. Let me post my code here.

    Single.php
    
    <?php get_header(); ?>
    <?php get_sidebar(); ?>
      <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <div id="wrapper">
    <?php if (in_category('on-the-table')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/onthetableheader.jpg" width="560" height="85" />
    <?php } elseif (in_category('the-hive')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/thehiveheader.jpg" width="560" height="85"/>
    <?php } elseif (in_category('the-dealio')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/thedealioheader.jpg" width="560" height="85" />
    <?php } elseif (in_category('sl-scene')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/slsceneheader.jpg" width="560" height="85" />
    <?php } elseif (in_category('hot-property')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/hotpropertyheader.jpg" width="560" height="85" />
    <?php } elseif (in_category('get-out')) { ?>
    <img style="margin-top:-50px; border-bottom:double #000;" src="<?php bloginfo('template_url'); ?>/images/getoutheader.jpg" width="560" height="85" />
    <?php } else { ?>
    <p></p>
    <?php } ?>
    
    
    
    
    	<div id="content">
    		<div class="post" id="post-<?php the_ID(); ?>">
    			<h2><a href="<?php echo get_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></h2>
    	
    			<div class="entrytext">
    				<?php the_content('<p class="serif">Read the rest of this entry &raquo;</p>'); ?>
    	
    				<?php link_pages('<p><strong>Pages:</strong> ', '</p>', 'number'); ?>
    	
    				<p class="postmetadata alt">
    					<small>
    						<p>Posted: <?php the_time('l, F jS, Y') ?> @ <?php the_time() ?>
    						<br>Categories: <?php the_category(', ') ?>.
    						<?php the_tags('<br>Tags: ', ', ', '.'); ?>
    						<br>						
    						<?php edit_post_link('Edit this entry.','',''); ?>
    						
    					</small>
    				</p>
    	
    			</div>
    		</div>
    		
    	<?php comments_template(); ?>
    	
    	<?php endwhile; else: ?>
    	
    		<p>Sorry, no posts matched your criteria.</p>
    	
    <?php endif; ?>
    	
    	</div>
    	
    
    </div>
    
    <?php get_footer(); ?>
    
    
    PHP:
    comments.php
    
    <?php
    
    
    // Do not delete these lines
    	if (!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME']))
    		die ('Please do not load this page directly. Thanks!');
    
    	if ( post_password_required() ) { ?>
    		<p class="nocomments">This post is password protected. Enter the password to view comments.</p>
    	<?php
    		return;
    	}
    ?>
    
    <!-- You can start editing here. -->
    
    <?php if ( have_comments() ) : ?>
    	<h3 id="comments"><?php comments_number('No Responses', 'One Response', '% Responses' );?> to “<?php the_title(); ?>”</h3>
    
    	<div class="navigation">
    		<div class="alignleft"><?php previous_comments_link() ?></div>
    		<div class="alignright"><?php next_comments_link() ?></div>
    	</div>
    
    	<ol class="commentlist">
    	<?php wp_list_comments(); ?>
    	</ol>
    
    	<div class="navigation">
    		<div class="alignleft"><?php previous_comments_link() ?></div>
    		<div class="alignright"><?php next_comments_link() ?></div>
    	</div>
     <?php else : // this is displayed if there are no comments so far ?>
    
    	<?php if ( comments_open() ) : ?>
    		<!-- If comments are open, but there are no comments. -->
    
    	 <?php else : // comments are closed ?>
    		<!-- If comments are closed. -->
    		<p class="nocomments">Comments are closed.</p>
    
    	<?php endif; ?>
    <?php endif; ?>
    
    
    <?php if ( comments_open() ) : ?>
    
    <div id="respond">
    
    <h3><?php comment_form_title( 'Leave a Reply', 'Leave a Reply to %s' ); ?></h3>
    
    <div class="cancel-comment-reply">
    	<small><?php cancel_comment_reply_link(); ?></small>
    </div>
    
    <?php if ( get_option('comment_registration') && !is_user_logged_in() ) : ?>
    <p>You must be <a href="<?php echo wp_login_url( get_permalink() ); ?>">logged in</a> to post a comment.</p>
    <?php else : ?>
    
    <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
    
    <?php if ( is_user_logged_in() ) : ?>
    
    <p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo wp_logout_url(get_permalink()); ?>" title="Log out of this account">Log out &raquo;</a></p>
    
    <?php else : ?>
    
    <p><input type="text" name="author" id="author" value="<?php echo esc_attr($comment_author); ?>" size="22" tabindex="1" <?php if ($req) echo "aria-required='true'"; ?> />
    <label for="author"><small>Name <?php if ($req) echo "(required)"; ?></small></label></p>
    
    <p><input type="text" name="email" id="email" value="<?php echo esc_attr($comment_author_email); ?>" size="22" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?> />
    <label for="email"><small>Mail (will not be published) <?php if ($req) echo "(required)"; ?></small></label></p>
    
    <p><input type="text" name="url" id="url" value="<?php echo esc_attr($comment_author_url); ?>" size="22" tabindex="3" />
    <label for="url"><small>Website</small></label></p>
    
    <?php endif; ?>
    
    <!--<p><small><strong>XHTML:</strong> You can use these tags: <code><?php echo allowed_tags(); ?></code></small></p>-->
    
    <p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
    
    <p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
    <?php comment_id_fields(); ?>
    </p>
    <?php do_action('comment_form', $post->ID); ?>
    
    </form>
    
    <?php endif; // If registration required and not logged in ?>
    </div>
    
    <?php endif; // if you delete this the sky will fall on your head ?>
    
    
    PHP:
    
    /*
    Theme Name: SL Magazine
    Theme URI: http://fluid-studio.net
    Description: SL Magazine Theme
    Version: 1.1
    Author: Fluid Studio
    Tags: fixed width, three columns, widgets
    
    
    /*-----------Block Level Elements--------------*/
    
    Body {
    	background: #D0D2D3; 
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 14px;
            color:#231F20;
    }
    
    #page {
    	width: 1024px;
    	margin: 0 auto;
    	background: #ECEBE9;
    	padding: 0;
          
    }
    
    #header {
    	width: 984px;
    	height: 119px;
            padding:20px;
    	background:url('images/header.jpg') #fff; 
    	background-repeat: no-repeat;
    	background-position: top center;
    }
    
    #headerad {
    	width: 727px;
            height:90px;
            background:#999;
            float:right;
    }
    
    #menu {
           width:984px;
           margin-top:8px;
           float:left;
    }
    
    #subscribelink {
           float:right;
           margin-right:220px;
           margin-top:-17px;
    }
    
    #subscribelink a {
           font:Georgia, "Times New Roman", Times, serif;
           color:#808284;
           font-size:11px;
           font-style:italic;
           text-decoration:none;
    }
    #subscribelink a:hover {
           color:#007EAC;
    }
    
    .description {
    	margin-left: auto;
    	margin-right: auto;
    	margin-top: 0px;
    	width: 450px;
    	text-align: center;
    }
    
    #wrapper {
    	margin-left: auto;
    	margin-right: auto;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 560px;
    	border-top: double #000;
    	border-right: double #000;
    	border-left: double #000;
            border-bottom: double #000;
    	background: #fff;
    	padding-top: 50px;
    	padding-bottom: 0px;
    	padding-left: 0px;
    	padding-right: 0px;
    }
    
    #content {
    	margin-left: auto;
    	margin-right: auto;
    	width: 550px;
    	background: #fff;
    	padding: 0 5px 0 5px;
    	border-bottom: 3px solid #ff0000;
    	padding-bottom: 50px;
    	color: #231F20;
    }
    
    .content a {
    	#007EAC;
    }
    
    #sidebar-lt {
    	float: left;
    	width: 228px;
    	margin-top: -14px;
    	margin-left: 0px;
    	margin-right: 0px;
            border-top:double #000;
    	background: #ECEBE9;
    
    }
    
    #recent {
            height:180px
            width:175px;
            background:#fff;
            margin-left:0px;
            margin-top:10px;
            scroll:auto;
            overflow:hidden;
    }
    #sidebar-rt {
    	float: right;
    	width: 228px;
    	margin-top: -14px;
    	margin-right: 0px;
    	margin-left: 0px;
            border-top:double #000;
    }
    
    
    #footer {
    	margin-left: auto;
    	margin-right: auto;
    	margin-top: 10px;
    	margin-bottom: 10px;
    	padding-bottom: 10px;
    	width: 450px;
    	text-align: center;
    }
    
    #footer p {
            color:#000;
            font-size:10px;
    }
    
    #footer a {
            color:#007EAC;
            font-size:10px;
            text-decoration:none;
    }
    
    /*-------------Headings-------------*/
    
    h1 {
    	color: white;
    }
    
    h1 a {
    	color: #000;
    }
    
    h2 {
    	color: white;
    }
    
    h3 {
    	color: white;
    }
    
    h4 {
    	color: white;
    }
    
    h5 {
    	color: white;
    }
    
    /*-------------The Post-------------*/
    
    
    
    h2 a:hover, h2 a:visited, h2 a {
    	color: #231F20;
            font-weight:bold;
            font-style:italic;
    	text-decoration: none;
    }
    .author {
           font-size:10px;
           font-weight:400px;
           font-style:normal;
           color: #716559;
           text-transform:uppercase;
    }
    .post {
    	padding: 10px;
    	text-align: justify;
    	color: #231F20;
            border-bottom: solid 1px #231F20;
    }
    
    .post p {
    	color: #231F20;
    }
    
    .post h3 {
    	color: white;
    }
    
    .post a {
    	color: #007EAC;
    }
    .post h2 a{
            color:#231F20;
    }
    .post ul {
    	margin: 7px;
    	padding: 0px;
    }
    
    .post li {
    	color: white;
    }
    
    .post ol {
    	color: white;
    }
    
    .entry {
    
    }
    
    .entrytext {
    	font-size: small;
    }
    
    .postmetadata {
            font-size:11px;
    }
    
    .postmetadata alt {
    	font-size: small;
    }
    
    .postmetadata a {
    	text-decoration: none;
    }
    
    .number {
            color:#fff;
            padding:3px;
            padding-top:1px;
            padding-bottom:1px;  
            background:#ff0000;
    }
    
    .readmore {
            float:right;
            margin-top:-26px;
    }
    
    .navigation {
    
    }
    
    .alignleft {
    	float: left;
            margin-right:10px;
    }
    
    .alignright {
    	float: right;
            margin-left:10px	
    }
    
    .aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    .pagetitle {
    	font-size: medium;
    }
    
    blockquote {
    	background: #404040;
    	padding: 2px;
    }
    
    cite {
    
    }
    
    a img {
    	border: 0;
    }
    
    acronym, abbr {
    
    }
    
    .post img {
          margin-bottom:10px;
    }
    
    /*--------------Sidebar------------*/
    
    .widget {
    	background: #ffffff;
    	margin-top: 10px;
    	border: 1px solid #ccc;
            padding:10px;
    }
    
    #sidebar-lt ul, #sidebar-rt ul {
    	margin: 0px;
    	padding-left: 0px;
    }
    
    #sidebar-lt ul h2, #sidebar-rt ul h2, .widget-title {
    	background: #efefef;
    	color: #000;
    	border-bottom: 1px solid #aaa;
    	padding-left: 0px;
    }
    
    #sidebar-lt ul li, #sidebar-rt ul li {
    	list-style-type: none;
    	list-style-image: none;
    	border-bottom: double #000;
            padding-left:12px;
            padding-top:15px;
            padding-right:10px;
            padding-bottom:10px;
            font-weight:bold;
            font-size:13px;
    	color: #000;
    }
    
    ul#blogroll {
            width:180px;
    }
    
    ul#blogroll li {
            border-bottom: 1px #716559 solid;
            margin-top:0px;
            margin-bottom:0px;
            padding-top:4px;
            padding-bottom:2px;
            padding-right:30px;
            font-size:11px;
    }
    
    ul#blogroll li a{
            color:#000;
    }
    
    #sidebar-lt ul li a, #sidebar-rt ul li a {
    	color: #007EAC;
    }
    
    #sidebar-lt ul ul, #sidebar-rt ul ul {
    
    }
    
    #sidebar-lt ul ul li, #sidebar-rt ul ul li {
    }
    
    #sidebar-lt ul ul ul, #sidebar-rt ul ul ul {
    
    }
    #recent li #recentblog a{
            padding-bottom:5px;
            border-bottom:solid #000 4px;
    } 
    
    li #recentblog ul.post-categories li {
            border:none;
            padding:0px;
            margin:0px;
            margin-bottom:-15px;
    }
    li #recentblog ul.post-categories li a{
            color:#A6A8AB;
    }
    
    #sidebar-lt p, #sidebar-rt p, .textwidget {
    	text-align: left;
    	padding-left: 0px;
    	padding-right: 0px;
    }
    
    #sidebar-lt a, #sidebar-rt a {
    	color: #007EAC;
    	text-decoration: none;
    }
    
    #sidebar-lt a:hover, #sidebar-rt a:hover {
    	color: #007EAC;
    	text-decoration: underline;
    }
    
    #sidebar-lt a:visited, #sidebar-lt a:visited {
    	color: #007EAC;
    	text-decoration: none;
    }
    
    
    
    /*--------------Search Form-------------*/
    #search {
    float:right;
    width:187px;
    height:25px;
    margin-top:-12px;
    margin-right:-2px;
    }
    
    #searchform {
    	width:187px;
    }
    
    #searchform input {
    	width: 140px;
    }
    
    
    #searchform input.button {
            width:37px;
            height:22px;
            background:url('images/gobutton.jpg') no-repeat;
            border:none;
    }
    
    #searchform #s {
            
    }
    
    /* Begin Comments*/
    .alt {
    	margin: 0;
    	padding: 10px;
    	}
    
    .commentlist {
    	padding: 0;
    	text-align: justify;
    	}
    
    .commentlist li {
    	margin: 15px 0 10px;
    	padding: 5px 5px 10px 10px;
    	list-style: none;
    
    	}
    .commentlist li ul li { 
    	margin-right: -5px;
    	margin-left: 10px;
    }
    
    .commentlist p {
    	margin: 10px 5px 10px 0;
    }
    .children { padding: 0; }
    
    #commentform p {
    	margin: 5px 0;
    	}
    
    .nocomments {
    	text-align: center;
    	margin: 0;
    	padding: 0;
    	}
    
    .commentmetadata {
    	margin: 0;
    	display: block;
    	}
    /* End Comments */
    
    /*-------------Calendar-----------------*/
    
    #wp-calendar {
    	width: 100%;
    }
    
    #wp-calendar th {
    
    }
    
    #wp-calendar a {
    
    }
    
    #prev a, #next a {
    
    }
    
    #wp-calendar caption {
    
    }
    
    /*-------------Images------------------*/
    
    
    
    
    /*-------------Other------------------*/
    
    hr {
    	display: none;
    }
    
    img#wpstats {
    	display:none
    }
    
    Code (markup):
     
    wompninja, Jun 30, 2010 IP
  10. wompninja

    wompninja Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #10
    Anybody? I just can't see anything that would be dumping it down so far.
     
    wompninja, Jul 1, 2010 IP