in reply to A call to keyboards: Better chatterbox wrapping

Is forcing wrapping needed at all? You can't even know the font size I use. Inserting spaces, even when at better offsets, will always be a suboptimal and lossy solution.

You can save yourself the trouble by putting each chatterbox line in a <div> that has, via CSS, overflow set to auto. Then every line that has a word in it that cannot be wrapped by the browser gets its own nice horizontal scrollbar, but only for the part that needs it. There already are <span> tags now (WHY? span+br is a red flag! Oh, and <span class="chat"><span class="chatfrom_221638"> should probably just be <span class="chat chatfrom_221638">), and those can be made <div>s, so it'll actually save some bandwidth ;)

DIV.chat { overflow: auto; } is all it takes, and lets you get rid of the ugly space insertion hacks of dozens of lines. Off-site example (that will be removed soon) can be found at http://juerd.nl/pmchattertest.html.

Juerd # { site => 'juerd.nl', plp_site => 'plp.juerd.nl', do_not_use => 'spamtrap' }

Replies are listed 'Best First'.
Re^2: A call to keyboards: Better chatterbox wrapping
by Corion (Patriarch) on Jan 10, 2005 at 13:55 UTC

    Cool idea, but your CSS on your demo site does not work with Mozilla 1.1 - no scrollbars are shown, so all the text that does not fit into the one line allotted to it just vanishes...

      Cool idea, but your CSS on your demo site does not work with Mozilla 1.1 - no scrollbars are shown, so all the text that does not fit into the one line allotted to it just vanishes...

      It works in Firefox 0.9 and Mozilla 1.7. As an upgrade is available and free, I don't think a browser bug is a good reason for not doing this. And if a workaround is needed, try adding width and/or max-width CSS attributes. If the bug is that it no longer grows vertically, height: auto; might fix it.

      Juerd # { site => 'juerd.nl', plp_site => 'plp.juerd.nl', do_not_use => 'spamtrap' }

        We have a definite requirement to support devices with weak and/or non-existant CSS support. While your idea is good, it doesn't address that requirement. Unfortunately not all of our users are using devices or in situations where upgrading or changing browsers is feasable so we need to find alternate solutions.

        ---
        demerphq

      yeah, and doesn't work w/NS 2.3 either. <grins>
      Think Moz 1.1, for all its many good characteristics and even better heirs, is NOTNOT a good test of applying css, as its css support was buggy and severely limited, at best.
Re^2: A call to keyboards: Better chatterbox wrapping
by Aristotle (Chancellor) on Jan 10, 2005 at 18:53 UTC

    Even simpler: just insert <span></span> into long words. The browser will wrap there, but copy-paste will retrieve the text verbatim. That'll work on every browser in every circumstance.

    Actually, I would advocate inserting &shy; entities (“soft hyphen”), which indicate wrap points and are only rendered when the browser actually has to wrap. Unfortunately, they currently only work as intended in IE, AFAIK.

    In general, I share your view that this is problem is being solved on the wrong level. I'm not sure there's much choice in this particular case, though.

    Makeshifts last the longest.

      Even simpler: just insert into long words. The browser will wrap there, but copy-paste will retrieve the text verbatim. That'll work on every browser in every circumstance.

      Oh, wow. That sounds like a more useful alternative than the space thing. Too bad it still requires the ugly hack. Still, much better than insterting spaces indeed. Wouldn't <b></b> be better, bandwidth-wise? It's an inline level tag, like span.

      It'd be great if all browsers really understood XHTML as XML, because then you could just use <span/> or <b/>.

      Juerd # { site => 'juerd.nl', plp_site => 'plp.juerd.nl', do_not_use => 'spamtrap' }

        Didn't think of those, since I never use <b> or <i>. But semantically they're as void as <span>, so why not.

        Makeshifts last the longest.