Hi all,
Let's consider the following two pages:
http://photos2.obones.com/photo.php?NoPhoto=483
http://photos2.obones.com/photo.php?NoPhoto=484
I'm using the suggestions from Patrick Vanbergen
(http://www.patrickvanbergen.com/dhtml/remaining_height.html) to have a
display where the bottom div takes the remaining height of the page and
displays a scroll bar when the content is higher.
This works just fine in Firefox but with a minor quirck under IE7. As
one can see, I put a gray background on the hbox class to show that the
vbox inside it goes outside its parent when displayed under IE7. I'm not
sure where this comes from and while I'm working around it right now by
adding a fake margin, I'd rather have a definite solution for IE7.
That's the first problem, but it's a minor one.
The second issue is with the "item" div which gets applied the
"photo_scrollbox" style.
What I would like is for it to stay at the top of the "vbox" div whether
it is scrolled or not. This works under Firefox, but not under IE7.
Then, I would like it to be placed at the right of the page, not at the
left as it is now. I played with various attributes, but I could never
get it to be at the right side of the page while not being beneath or
above the displayed scrollbar.
And finally, the third issue is with the display of the photo at the
center. I apply a "max-witdh" property to it which is understood by both
FF and IE7 as I indicated my pages are XHTML1.0 compliant. Using HTML4
was making IE ignore the max-witdh property.
It works just fine as photo 484 is too large and gets resized to fit in
the available display width. The problem comes when I resize the browser
window as I would expect the image to resize to match the new window
width. This works just fine in IE7, but this time it is the Firefox
browser that seems to ignore max-width when resizing.
I know that the "remaining height" layout requires non conventional
styles but after having looked around a while, it's the only solution
that was good enough for this type of rendering. If another more
standard way is available, please let me know.
Compatibility with Firefox 2 and IE7 is required, while compatibility
with other browsers is only a bonus and is not required for now (and
will most likely never be required).
Thanks a lot in advance for your help.
Regards
Olivier
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
