Proper way to display "Code" sections in HTML/CSS?

Question

Is there a "best way". Something that sort of makes the portion of code look inset?

For instance, how SO displays "code" sections on posts for example?

I know Bootstrap has "Wells" but when not using it, is there a particular way that is functional looks nice?

dippas · Accepted Answer · 2017-04-23 03:00:56Z

2

You can use the tag pre or code for that kind of things.

code { 
    background: rgba(0,0,0,.2)
}

pre {
    white-space: pre-wrap;
    background: rgba(0,0,0,.2)
}

The <code>&lt;code&gt;</code> tag.

<pre>
Here's a  &lt;pre&gt; tag. some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text some more text 
</pre>

edited Apr 23, 2017 at 3:00

answered Apr 23, 2017 at 2:54

dippas

60.8k15 gold badges125 silver badges134 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Proper way to display "Code" sections in HTML/CSS?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related