Link to home
Start Free TrialLog in
Avatar of Mike Eghtebas
Mike EghtebasFlag for United States of America

asked on

To display code...

Using:

<code>
a=a+1
</code>

in a html5, displays "a=a+1" almost correctly like code would look like.

Question: What other tag types are able to display code parts on a website like code (different than the text description)?

I want test them and choose a good one for my use.
ASKER CERTIFIED SOLUTION
Avatar of Mark Bullock
Mark Bullock
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Mike Eghtebas

ASKER

<pre> looks good. But it centers the code. I added the following to mt css:

pre {
    display: block;
    font-family: monospace;
    white-space: pre;
    margin: 1em 0;
      text-align:left;
}

But it is still centered. What am I doing wrong here?
Remember that the <code> tag is both a semantic marker and a kind of formatting directive. If you want your code display to break lines to fit into the browser's rendering window, you can leave it at that. If breaking the lines would mess up the code, you may want to include a <pre> tag (for pre-formatted text, text formatted by white space and other typographical conventions).

You can get fancier with CSS.
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I find <xmp> the best. Regarding text justification: Considering number of the tabs prior to the start of the following line, it really was not centering. I had like

<pre>
                                   a=1+1 			
</pre>

Open in new window


but i needed to have it like:

<pre>
a=1+1 			
</pre>

Open in new window


edited: <xmp> has been deprecated so I am back using <pre>