Quoting "programming code" in an article.

Forum Moderators: open

Message Too Old, No Replies

Quoting "programming code" in an article.

Which tags to use?

fischermx

5:39 am on May 17, 2006 (gmt 0)

I want to quote some programming code in an article.
Which is the appropiate tag to use?

encyclo

9:55 am on May 17, 2006 (gmt 0)

The ideal element is

<code></code>

, which was specifically introduced to display computer code. As it is an inline element, you may want to wrap it in a

pre

element so as to preserve the white space:

[htmlhelp.com...]

The

code

element can be easily styled with CSS, the default style is usually a monospaced font.

fischermx

6:05 pm on May 17, 2006 (gmt 0)

Thanks a lot!
I was using "pre" only.

fischermx

4:49 am on May 19, 2006 (gmt 0)

I am now using this, but facing a little problem.
I'm using pre and code to quote programming code, but it renders different in IE and Firefox.
In IE the font is of a nice size while in Firefox looks tiny. Increasing the fontsize does not work since it creates a bigger font in IE.
Is this a known IE bug?

tobyink

8:08 am on May 21, 2006 (gmt 0)

In IE the font is of a nice size while in Firefox looks tiny. Increasing the fontsize [...] creates a bigger font in IE. Is this a known IE bug?

The font size is nice in IE.
Increasing the font size creates a bigger font in IE.
Sounds more like the bug is with Firefox.

encyclo

2:03 am on May 22, 2006 (gmt 0)

Are you explicitly defining the font size for both the

pre

and

code

elements in your CSS? The problem is due to the different default styles in the two browsers.

fischermx

3:15 am on May 22, 2006 (gmt 0)

Yes, it is the same size: 1.1em.

I'm realizing the same problem is present with the Microsoft site, when you are browsing their books online the font looks nice in IE, but tiny in Firefox/Netscape.

bedlam

4:00 am on May 22, 2006 (gmt 0)

One way of getting Mozilla / IE Win to display fonts at about the same size is to do something like this:

CSS

body { font-size:101%; }
#container { font-size:90%; }

HTML

<body>
<div id="container">
...
...
...
</div>
</body>

-b

kaled

10:23 am on May 22, 2006 (gmt 0)

it is the same size: 1.1em

Try { font-size:16px } or { font-size:12pt }

The latter version may scale in IE (not sure) but the former won't.
Using a relative font-size to overcome default stylesheet discrepancies is always doomed to failure.

Kaled.