Solved

HTML page footer disappears when browser zoom is more than 100%

Posted on 2014-01-09
4
446 Views
Last Modified: 2014-01-09
http://www.gfprinfo.com/index.html

The above linked page is javascript animated with CSS. Unfortunately, I've broken something on the page and don't know where to look to troubleshoot the following issue.

Issue -
Initially, the page header, content, and footer sections displayed properly no matter the browser zoom setting. Upon making multiple edits, I note that the header and content are scrollable but the page footer no longer displays at all when browser zoom exceeds 100%.

Can you point me in the right direction to troubleshoot why the footer no longer displays when browser zoom exceeds 100%?  I suspect a CSS property like If class = "something" but I really am way outside of my comfort zone here.

BTW, I'm a long time EE reader but this is my first EE question.
0
Comment
Question by:whatsupicon
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39768693
Remove the F you have in there just after the BODY tag and then move all those css/js includes, meta tags and title tag into the head tag - they shouldn't be in the body tag.
0
 

Author Comment

by:whatsupicon
ID: 39769427
I appreciate your response and thank you for the good information, Cathal.

I've done what you suggest and still the footer is not visible when browser zoom exceeds 100%. Do you have further recommendations?

Further research of the issue led me to something Dreamweaver identifies as a browser compatibility issue referred to as Unscrollable Content Bug. View solutions to the Unscrollable Content Bug on Adobe.com

Upon reading the information at the Adobe link, I'm unsure if this is the culprit. What do you think?

I'm ready to award points but really need to see that page footer when browser zoom exceeds 100%. Thanks, in advance, for your continued attention, Cathal.
0
 
LVL 58

Accepted Solution

by:
Gary earned 355 total points
ID: 39769474
Remove

.extra {
    overflow: hidden;
}


styles.css line 32
0
 

Author Closing Comment

by:whatsupicon
ID: 39769529
Thank you very much, Cathal - concise and informative answer.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Powershell GUI 11 91
Exchange Server 2013 Message Tracking log Powershell ? 11 109
CSV file copy field 1 to field 2 2 62
Selenium cssSelector and attribute 5 10
This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
In threads here at EE, each comment has a unique Identifier (ID). It is easy to get the full path for an ID via the right-click context menu. However, we often want to post a short link within a thread rather than the full link. This article shows a…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

737 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question