Beefy Boxes and Bandwidth Generously Provided by pair Networks
XP is just a number

Rein in overly long|wide code segments via CSS

by parv (Vicar)
on Apr 02, 2008 at 09:37 UTC ( #677921=monkdiscuss: print w/replies, xml ) Need Help??

To rein in the overly long or overly wide code segments (adjust as you like)...

/* Works as expected in Firefox 2.0.x & Opera 9.5. */ p.code { /* background-color: #101020 !important; color: #eee !important; */ overflow: auto; height: 50ex; /* 'overflow' takes care of the width by itself. width: 100ex; */ }

... personally I do not like the scrolling or empty area thus produced myself, but produces a better compromise in that it allows me to read rest of the posts.

Updated CSS with which I am happy now (adjust "Code Wrap Length" and "Auto Code Wrapping" according to your own tastes) ...

p.code, pre.code { /* background-color: #202025 !important; color: #eee !important; */ overflow: auto; max-height: 55ex; }

Replies are listed 'Best First'.
Re: Rein in overly long|wide code segments via CSS
by grinder (Bishop) on Apr 02, 2008 at 10:23 UTC
    I do not like the scrolling or empty area thus produced myself

    Why do you force the width and height then? I just do

    .code { overflow: auto; }

    and this seems to do the right thing by me.

    • another intruder with the mooring in the heart of the Perl

      I see that "overflow" alone takes care of the width just fine; thanks grinder. I would still need to take care of overly long code segments myself.

      Only if I could specify a maximum height after which "height:" attribute would take effect (without JavaScript)!

        The max-height attribute does exactly that. It works fine for me in my somewhat-recent Firefox.


Re: Rein in overly long|wide code segments via CSS
by ikegami (Pope) on Apr 02, 2008 at 10:10 UTC
      I already have that unchecked (and "Auto Code Wrapping" checked). These settings do not have any effect if there is no whitespace to break on.

        PM code wrapping only occurs if "Auto Code Wrapping" is unchecked. After the specified width, the line is broken and a red "+" is placed in the first column indicating it's a continuation. Clicking the "download" link provides the unwrapped code.

        1234567890123456789012345678901234567890123456789012345678901234567890 +123456789012345678901234567890
        looks like
        1234567890123456789012345678901234567890123456789012345678901234567890 +123456789012345678901234567890 [download]

        Anyway, just posting an alternative.

Log In?

What's my password?
Create A New User
Domain Nodelet?
Node Status?
node history
Node Type: monkdiscuss [id://677921]
Approved by ikegami
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others browsing the Monastery: (5)
As of 2021-09-24 13:06 GMT
Find Nodes?
    Voting Booth?

    No recent polls found