Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    image scaling issue - IE6/IE7

    On my website, the left and right navigation frames are fixed in width, so the center frame resizes according to the browser width.

    The "About Us" page includes a photo at the top of the frame that's intended to fill the width of the center frame. When the browser window reaches a certain minimum width, the idea is to force a horizontal scroll bar on the center frame (not yet implemented).

    My developer isn't familiar with working with images. I know a bit of html so I experimented with putting the img tag inside a div container with the img width set to 100% and the div width set to auto. This works perfectly in Firefox. My developer verified it also works in IE8 (I can't verify this). Here's a hidden test page showing how this works: www.acrightsize.com/about.php

    Unfortunately, when viewed in IE6 and IE7, the image is fixed at a very large size (wider than the browser window), forcing the center frame to extend well beyond the browser window and pushing the right frame completely out of the window.

    Until I can make this work properly across browsers, I set up the live page with a fixed size image (www.acrightsize.com/about_us.php).

    The fact that my div container accomplishes the desired result in FF/IE8 was a lucky guess. But there are obviously other ways to code this, hopefully one that also works in IE6 and IE7. I would be grateful if someone would take a look and help me out.

    edit: Here's a link to browsershots of the page with various browsers
    http://browsershots.org/http://www.a....com/about.php
    Last edited by ginahoy; 06-13-2009 at 08:43 AM.

  • #2
    New to the CF scene
    Join Date
    Jun 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Since my op, I narrowed the problem to an issue with the way IE6/IE7 handle image scaling inside a table container.

    I can't defend the coding scheme of the page I posted. But in fairness to my developer, I set up the "about us" page myself by simply re-working another page on my site. As it turns out, there are a couple of unnecessary layers of nested containers, which were needed on the page it was cloned from. But at least it validates!

    Over the weekend, I ripped out everything except what's required to present the complete page. The code was about as bare as it can get but image scaling issue still occurred in IE56/7. During this process, I accidentally discovered IE only chokes when it's scaling *down* an image, not when scaling up an image. So if I make the image smaller than the space, IE behaves like other browsers. This was an a-ha! moment. Unfortunately, the image looked like crap when scaled up by a browser (no surprise).

    I found a couple of references to this issue. Apparently, the bug is specific to scaling down an img contained inside a table.

    I was finally able to discuss with my developer yesterday. He said there are ways to use styles to build a multi-frame site presentation without using tables/rows/cells, but he coded it the way he's most familiar. In any case, his time is limited right now and I'm not willing to do a redesign until the business starts generating revenue.

    So I need help finding a work-around... something that I can implement. Your assistance would be greatly appreciated!

    David


  •  

    Posting Permissions

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