SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jun 2007
    Location
    Saint Louis, MO
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    currentStyle.height in IE7 returns "auto"

    I'm setting up a page which serve as an image gallery of a friend's photographs. The menu system I'm using consists of a DIV to the left of an area which will display the photo. There may additionally be commentary about the photo in the area on the right.

    The DIV contains the thumbnails of the images available for display. I would like to make the DIV the same height as the content of the area to the right. Here is an image of what I mean:



    The area in red is the thumbnail DIV. The area in blue is the variable content area. This shows the image after a resize (which I'm also handling, as well as the onload), but the same idea applies for fixed browser width and different amounts of content.

    The approach I'm using now uses javascript to look at the height on the content area and then set the height of the DIV to match. Here is the getStyle() function I'm using:

    Code:
    function getStyle(el,styleProp)
    {
    	var x = document.getElementById(el);
    	if (x.currentStyle)
    		var y = x.currentStyle[styleProp];
    	else if (window.getComputedStyle)
    		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
    	return y;
    }
    
    //Thanks go to http://www.quirksmode.org/dom/getstyles.html for providing the script.
    While this works fine in Firefox 2.0.0.4, it doesn't work in IE7, because the content area's height is evaluated as "auto" and not a number. Is there a way around this? I'd like to get at least a float, which I can convert to an int to pass to my DIV's currentStyle.height.

    Thanks!

    Derek Hauffe

  2. #2
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Use the offsetHeight property.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  3. #3
    SitePoint Member
    Join Date
    Jun 2007
    Location
    Saint Louis, MO
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That does the trick -- thanks!

    Derek


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •