Pre tag vs Code tag

  • boxmein
    15th Jun 2012 Former Staff 1 Permalink
    Right now, I see no _real_ use on a <pre > tag. What if it was perfectly similar to a code tag beside one difference: it's an inline element. It would make code post formatting slightly easier, yet use little CSS.
    For example, the current CSS for a code tag is:

    code {
    padding: 4px;
    display: block;
    border: 1px solid #CCCCCC;
    background-color: rgba(230, 230, 230, 0.5);
    overflow: auto;
    white-space: pre;
    }

    To accommodate for the new change, a really slight modification to the CSS is necessary:

    code {
    display: block;
    padding: 4px;
    }
    pre {
    display: inline;
    padding: 2px 1px; /* Different from code to fit better into a line of text */
    }
    code, pre {
    border: 1px solid #CCC;
    background-color: rgba(230, 230, 230, 0.5);
    overflow: auto;
    white-space: pre;
    }


    I have experimented in my custom style for this site and it looks great.
    image
    For example, if you want to differentiate a function call from the rest of the text yet you don't want it to be placed into a block element, just use a pre tag to make it inline and efficient.
    It's just a style issue. YEAAAAHHHHHH
    >edit:
    This is a
    function() { test(); }
    test.

    function test() {
    //code goes here
    }
  • Fast-Driver
    16th Jun 2012 Member 0 Permalink

    I wish Simon would add an option to use your CSS style in the profile so we can have a light one and a dark one as well.

  • boxmein
    16th Jun 2012 Former Staff 0 Permalink
    @Fast-Driver (View Post)
    Oh, my style is hardly complete.. If it would *really* happen, then I'd finish it post-haste, of course :D
  • nmd
    16th Jun 2012 Member 0 Permalink

     

    @boxmein (View Post)

    Ask, and you shall receivith

     

    *bump*

  • boxmein
    16th Jun 2012 Former Staff 0 Permalink
    @nmd (View Post)
    Thanks! :3
  • DJspiderize
    16th Jun 2012 Member 0 Permalink

    I would give my opinion on this....

    But I didn't really understand it....

    Yeah....

    Bump?

  • Nab1929
    16th Jun 2012 Banned 0 Permalink
    This post is hidden because the user is banned
  • boxmein
    16th Jun 2012 Former Staff 0 Permalink
    @DJspiderize (View Post)
    Basically, when you usually write code with the <code> tag, then it separates the entire code with blank lines. What if the <pre> tag could be used to write code inside the text, without separating with blank lines? For example, <p> works as a "block element" because it makes itself into a "block", but an "inline" element such as <span> doesn't really wrap itself like that.

    Screenshot
  • DJspiderize
    17th Jun 2012 Member 0 Permalink

    @boxmein (View Post)

    Ah, I get it. Thanks for the explaination. Since I now know what you're talking about, I agree with you :3

  • boxmein
    19th Jun 2012 Former Staff 0 Permalink
    Any moderator / developer feedback please? Someone that could make this happen or decline it?
Locked by jacob1: Lock Requested