469,889 Members | 1,241 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,889 developers. It's quick & easy.

Internet Explorer and overflow: hidden with images

I'm making a Javascript program that uses overflow:hidden on a containing
div to crop an image. This page (temporarily) shows an example of what I
mean:

http://www.people.fas.harvard.edu/~night/crossroads/

The relevant markup is:

<div style="overflow:hidden; width: 238px; height:47px;
border: thin yellow solid;">
<img src="hidden-overflow.png" alt="hidden overflow!"
style="width:294px; height: 47px;">
</div>

In a CSS2-compliant browser, you'd see part of the image; in IE (both 6
and 7) you see the whole thing. Strangely enough, though, it does properly
crop text. So I'm hoping there's some workaround, some hack or quirks-mode
setting to get it to work. Right now the best thing I've got for IE users
is an iframe, blah.

I searched this newsgroup, and I found a couple of mentions of this
problem, but no solution. I hope I'm not being tiresome.

Thanks,
Christopher

PS: Sorry that I'm using CSS in such a bizarre way with this program. I
really do believe in the CSS "philosophy" and I use it accordingly in my
actual web documents! This is the exception.
Mar 28 '07 #1
5 6690
Christopher Night wrote:
>
http://www.people.fas.harvard.edu/~night/crossroads/

In a CSS2-compliant browser, you'd see part of the image; in IE (both 6
and 7) you see the whole thing.
If you expect browsers to behave in a compliant manner, you shouldn't
trigger quirks mode.
http://www.hut.fi/u/hsivonen/doctype.html

--
Berg
Mar 28 '07 #2
On Wed, 28 Mar 2007, Bergamot wrote:
Christopher Night wrote:
>>
http://www.people.fas.harvard.edu/~night/crossroads/

In a CSS2-compliant browser, you'd see part of the image; in IE (both 6
and 7) you see the whole thing.

If you expect browsers to behave in a compliant manner, you shouldn't
trigger quirks mode.
http://www.hut.fi/u/hsivonen/doctype.html
Well when did I ever trigger quirks mode? I use the 4.01 Strict doctype.

Thanks,
Christopher
Mar 29 '07 #3
Christopher Night wrote:
On Wed, 28 Mar 2007, Bergamot wrote:
>Christopher Night wrote:
>>>
http://www.people.fas.harvard.edu/~night/crossroads/

In a CSS2-compliant browser, you'd see part of the image; in IE (both 6
and 7) you see the whole thing.

If you expect browsers to behave in a compliant manner, you shouldn't
trigger quirks mode.

Well when did I ever trigger quirks mode? I use the 4.01 Strict doctype.
Oops, I saw the URL was missing and assumed it was Transitional. My bad.

BTW, my IE6 shows the overflow is handled correctly ('NOT' is hidden).

--
Berg
Mar 29 '07 #4
On Wed, 28 Mar 2007, Bergamot wrote:
Christopher Night wrote:
>On Wed, 28 Mar 2007, Bergamot wrote:
>>Christopher Night wrote:

http://www.people.fas.harvard.edu/~night/crossroads/

In a CSS2-compliant browser, you'd see part of the image; in IE (both
6 and 7) you see the whole thing.

If you expect browsers to behave in a compliant manner, you shouldn't
trigger quirks mode.

Well when did I ever trigger quirks mode? I use the 4.01 Strict
doctype.

Oops, I saw the URL was missing and assumed it was Transitional. My bad.

BTW, my IE6 shows the overflow is handled correctly ('NOT' is hidden).
Oh that's good news! What OS are you running it on?

-Christopher
Mar 29 '07 #5
Christopher Night wrote:
On Wed, 28 Mar 2007, Bergamot wrote:
>>>Christopher Night wrote:
>
http://www.people.fas.harvard.edu/~night/crossroads/
>
In a CSS2-compliant browser, you'd see part of the image; in IE (both
6 and 7) you see the whole thing.

BTW, my IE6 shows the overflow is handled correctly ('NOT' is hidden).

Oh that's good news! What OS are you running it on?
Win 2K Pro

--
Berg
Mar 29 '07 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

6 posts views Thread by pradeep_TP | last post: by
2 posts views Thread by swethak | last post: by
1 post views Thread by Waqarahmed | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.