himanshu Dhingra
asked 10 years ago

Hello, 
I just added content to the footer and what I observed is that the sidebar is overlapping the content on the footer, ie the first few words of each line is footer is behind the sidebar.

Please tell how to fix this?

3 Answers
DominicStaff
answered 10 years ago

Please send me your site for further checking.

himanshu Dhingra
replied 10 years ago

following is my site, its still under maintenance mode, but you can have a look at footer.

And is there any way that the logo gets detached from the header bar and header navigation bar becomes slim, because my logo is big so it is also making the navigation bar big making it looking bad.Also what is the css to make that about us on the navigation bar align vertically center?http://www.gutargoo.com/
I am sorry, I asked 3 questions in a row, but i'll really appreciate if you'll answer all:)waiting for your reply.

Dominic Staff
replied 9 years ago

Please send me username & password of your site (via private answer) for further checking.

himanshu Dhingra
replied 9 years ago

hello sir, if you want to see any codes of any file, let me know I’ll send it here?But please solve my problem.

DominicStaff
answered 9 years ago

– Please send me the php file that you added the footer section.
– To resolve the issue with your logo & navigation bar align vertically center, you can add the following code to the style.css file:

#branding h1 { height: 67px; }
#header #navigation li a { height: 67px; line-height: 67px; }

Hope this helps !

himanshu Dhingra
replied 9 years ago

Hello sir, this code worked for the vertical alignment and thanks for that. But navigation bar is still big, but i want navigation bar to be narrow and logo as the same size.And I'm not using any php code for footer.I installed a plugin "Header and Footer Commander", which allows to add html code and it automatically adds to footer.Following is the footer.php code
</div><!– Main –>
<a href="#header" class="scroll-top"><i class="fa fa-caret-up"></i></a>
<?php wp_footer(); ?>

</body>
</html>

Dominic Staff
replied 9 years ago

Hi,Firstly, please remove the older css code in the previous answer then add the following code to the style.css file:

#header #navigation li a { height: 37px; line-height: 40px;}
#branding h1 {height: 36px;}
#branding #site-title img {height: 36px;}

– To resolve the issue with footer section, you can add the following code:

<?php wp_footer(); ?>
</div><!– Main –>
<a href="#header" class="scroll-top"><i class="fa fa-caret-up"></i></a>
</body>
</html>

Hope this helps !

himanshu Dhingra
replied 9 years ago

THANK YOU, THANK YOU THANK YOU! Sir both the things worked like magic.

Orion Nettuno
answered 8 months ago

I tried a load of css that didn’t fix it but finally I invented a solution.

1. Create a small block the size of the overlap in paint and click a single little black dot in the corner.
2. Use an online background removal tool to make the block transparent.
3. Add the image to the bottom of your sidebar.

Now the only thing that overlaps is an invisible image.

Powered by DW Question & Answer Pro