Content overlaps footer in Chrome

  • Hi, I’m using theme Xenon on my blog at https://www.graffitiinindia.com which I started recently. The theme is just fine but there’s just one problem.

    Every post has one or more photos. When a certain post is long, the footer doesn’t shift down as the images show up in the post. The footer gets fixed at a position once the location of the to-be-loaded images is decided. Hence, the content overflows and overlaps the footer as the images load thereafter.

    I get this problem in Chrome, not in IE or Firefox where the footer shifts to the bottom as it should.

    Please help me out. ??

Viewing 8 replies - 1 through 8 (of 8 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I don’t see the footer overlapping the content in chrome, which version of chrome are you using?

    Thread Starter rohitbedi88

    (@rohitbedi88)

    Version 26.0.1410.43 m

    For an example – https://graffitiinindia.com/daku-devanagiri-delhi/

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It looks like a plugin is at fault. Try deactivating them one-by-one to explore which.

    Thread Starter rohitbedi88

    (@rohitbedi88)

    OK Sir, I’ll get back after I test the plugins.

    Thread Starter rohitbedi88

    (@rohitbedi88)

    I deactivated all the plugins and still the problem persists ??

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    This is the problem;

    <div id="primary" class="content-area grid_9 equal_height" style="height: 1316px;">

    If it’s not a plugin that’s putting the height inline, do you know whether this page’s template file has been edited?

    I don’t see the text over lapping in Chrome.

    Thread Starter rohitbedi88

    (@rohitbedi88)

    I have not made any changes in the template.

    The code you pasted:

    [ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]

    <div id="primary" class="content-area grid_9 equal_height" style="height: 1316px;">

I don't know how style="height: 1316px;" is appearing there.

Here is the page template code (page.php)

<?php get_header(); ?>

		<div id="primary" class="content-area grid_9 equal_height">
			<div id="content" class="site-content" role="main">

				<?php while ( have_posts() ) : the_post(); ?>

					<?php get_template_part( 'content', 'page' ); ?>

					<?php //comments_template( '', true ); ?>

				<?php endwhile; // end of the loop. ?>

			</div><!-- #content .site-content -->
		</div><!-- #primary .content-area -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

    Single post (single.php)

    <?php get_header(); ?>

		<div id="primary" class="content-area grid_9 equal_height">
			<div id="content" class="site-content" role="main">

			<?php while ( have_posts() ) : the_post(); ?>

				<?php get_template_part( 'content', 'single' ); ?>

				<?php
					// If comments are open or we have at least one comment, load up the comment template
					if ( comments_open() || '0' != get_comments_number() )
						comments_template( '', true );
				?>

			<?php endwhile; // end of the loop. ?>

			</div><!-- #content .site-content -->
		</div><!-- #primary .content-area -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

    I’m completely lost, dunno where that height is coming from.

    @bumblebeeme – I hope it’s just me whose getting the overlap ??

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Content overlaps footer in Chrome’ is closed to new replies.