[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 736
  • Last Modified:

IE8 CSS - DIV doesn't grow to height of the main DIV if the content has form fields

https://test.pdswebpro.com/newpatient.aspx

The above test site page will demonstrate the problem in IE8 only (IE 7 works fine)

If the main content area is taller than the left DIV "AND" it has form fields, the main content window will not open to the full height of the content.  If you mouse around or tab around in the DIV, the main DIV will open.  Also if you are in the IE Developers tools and change any attribute in the offending DIV it will open.  Do not let this fool you.  If I make the same change to the actual style sheet it doesn't change anything.

The DIV that is not growing is called "middle"
0
bcolladay
Asked:
bcolladay
  • 4
  • 3
1 Solution
 
LZ1Commented:
Take the display:inline-block off of the #footer
0
 
bcolladayAuthor Commented:
Took it off, it was unnecessary but didn't change the problem.  The problem debugging this in the developer tools is, that if you make any changes it appears to fix it.  But much like the fact that if you mess with the mouse it also expands the div, it doesn't fix the initial display problem.  I left the display:inline-block off the footer, you can see it will still be messed up if you close the page and bring it back up.

Also try the navigation links to the left, it does weird things too if you click each one...they are self links
0
 
s8webCommented:
Looks like you need to clear your floats. Insert this before you close the div that your form is residing in:

<div style="clear:both"></div>

If you're running out of time, and that doesn't work, you can reach for the holy hand grenade and force ie8 to render like 7 by putting:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Under your <head> opening tag.

0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
bcolladayAuthor Commented:
<div style="clear:both"></div>
 Is the winner!  Great solution.  I've never heard of this.  Gues I will have to get my CSS book back out of the closet.
0
 
bcolladayAuthor Commented:
Great, perfect solution.
0
 
s8webCommented:
Other issues:

You have a unordered list nested inside a span tag on line 38.

Line 53 has a h1 nested in a span.

You're applying an id to the head opening tag - ?

Some of your ID's start with an underscore. ID's and class names must begin with a letter.
0
 
s8webCommented:
Happy coding :)
0
 
bcolladayAuthor Commented:
Yep, this is a pretty messy CMS I wrote, lots of things "I'll go back and fix that later..." thanks.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now