Raymond Martens

Dear Mark,


I read with great interest your site on 'No IE did not handle it
properly'. I was really astonished to see that many of the things I
tried with IE where actually bugs!

On the 'overflow: visible' page you mention that the W3C standard can do
much more than IE (with float, clear, min/max-height/width, overflow...)
But I have a case where I would like mozilla (and all other standard
compliant browsers) to do exactly like IE.

The problem:

I have a box with a lot of content in it. That box is resizable via a
image the user can drag. But the user should not be able to make the box
so small that some of the content is either not shown or spills over.
So in IE I use set the style.width property of the box element. This
makes IE resize the box but only to a certain point - making sure all
content always fits into it. Then I can read the size the box has by
reading the offsetWidth property. Then I can adjust the style property
again.

Now Mozilla and Opera support the offsetWidth property but the problem
is that they will not stop making the box smaller until the width of it
is 0px. 

So either I have to find a way of telling mozilla to behave like IE or I
need a way to compute the least width the content of a div (or any other
html-element) can take without overspilling or hiding or creating
scrollbars.

Any advice would be very usefull.

Best Regards,

Ray

Tarquin,


Thank you so much for your prompt and very accurate answer - it helped
me a lot. But I found out that when I make the display: table-cell, I
can resize the box perfectly, except that it won't resize bigger than
it's original width!

I played around a bit with different display-values and found that
display:table does the trick. It solves both problems. 

Now the next problem that comes up is that mozilla ignores the
border-style:outset and shows a border-style:groove. I guess this is not
a feature but indeed a display bug. (Only inset and outset get
misinterpreted, all other styles are shown as expected.)

- but wait: I found out - it only happened when
'border-collapse:collapse;' was used. Dunno why I had that line in
there... So as I removed it, it solved the border-style problem as well.
Any explanation to that?

Best Regards,

Ray

P.S: If you are anyhow interested in seeing what I'm using it for:

[project page address]

It is yet another browser based editor ;) works on mozilla (1.3+?) and
ie (5+)
It might take some time to load the first time (even 20 seconds) but I'm
working on that - as on many many other issues.

What makes mine different to the bunch of other ones around, is that it
auto-loads on client-side, is _very_ modular, really compatible to IE
and mozilla and aimed at being integrated into any site very easily.

I will soon create a project page for it.

Dear Mark,

I wanted to share this creation of mine with you. It is still only
adapted to modern browsers but can be done for IE as well.

I used your 'Nested list collapsing script' to make a first try
implementing the same functionality as the 'Collapsible list generation
controls' script.

Most importantly CSS is used to obtain these results.

I could also do some 'behaviour' to automatically switch between a plus
and a minus.

If it's of any interest for you, feel free to use it. -Ray

Mark:

I made an update of the list. Now it will also correctly switch +/- in
Mozilla (don't know for others). I also introduced a new parameter in
your script to make it possible, that only the 'plus/minus' is used as a
link and not the whole list-item.

Any comments from your side? -Ray

Mark,

Thank you, always nice to hear, especially from the 'godfather of
javascript browser compatibility' ;)

Cool that Opera does it - Unfortunately for IE it's more difficult,
because 'IE7' (Dean Edwards project) won't work correctly at this stage.

This is why I finalized a script (in the attachment) that will make it
work with IE5+.

Of course you may make anything available I send/sent you - I'm happy
with it.

For the modification of your script, you might have noticed, that the
new parameters are always the last ones in the function call and
defaulted to false (easier for transition).

Ray

Dear Mark,


I wanted to tell you that I added some functionality to your mini-window
script:
I added the possibility of creating an IFRAME in the main-content like this:

var iFrameData = ['iframeName', 'iframeURL', windowWidth, windowHeight,
useScrollbar];

createMiniWinLayer(iFrameData, ....);

The special thing about it, is that when dragging the mini-window or when
resizing it, I hide the frame to ease the mouse operations (you surely know
that it is not quite handy loosing all mouse events to the iframe).

I added the files for this; it is still draft though.

The reason I did this, is because I often need external windows, but the data
comes from another file - or the content of that window changes often.

Since my first e-mail somehow didn't get to you, I got time to add a new
file: the calendar-popup using the miniwindow. It was just the idea of making it
usable with _any_ popup-blocker.

To see it all, just start the 'movablewindow.html'

The file can be downloaded at

http://www.aiesec.org.mx/aleweb/uploads/movable_window_addition_draft_c.rar

Best regards,

Ray