Problems showing html code in a web page

[condimen]

I’m trying to show some code using prettify and everything goes fine with css, but when I try with html it doesn’t work.
I use pre and code tags, like code blocks in this forum, but I’m missing something.
Can you help?
My code in jsFiddle

[Senff]

According to the Prettify usage FAQ:

Put code snippets in

...

or ... and it will automatically be pretty printed.

Would that help?

[condimen]

I tried that way, but still nothing. I don’t think the problem is prettify, cause it doesn’t work either without any classes applied.
What happens is that the html inside pre tags is still considered as html, so if I have for example:

What I get is a div element on my page, when I should be getting just this text: <div><!–html–></div> so prettify could style it properly.

		
	

[Senff]

If you look at this very page and how the code blocks are styled: the PRE tags are still in the markup (with class “prettify”), used as the container, and everything in it is styled through CSS.

I have no experience with Prettify so I’m not sure if that’s the way it works, but I’m just going after what I see on CSS-tricks.

[condimen]

Wow, you’re fast!
I think I wasn’t clear. Let’s forget prettify. The pre and the code tags should appear in the markup, but the div should’t be a “real” div, it should be just text.

[Senff]

Right, but to replace the < characters with < isn't that exactly what Prettify does? If those characters are not replaced, then maybe the prettify script is not loaded properly.

Or maybe I should just leave this to the Prettify experts.

[condimen]

It doesn’t replace the < with <. It wraps the div with a span with a class
This is inside the code tag:

[condimen]

Here is an image http://cl.ly/FUGm

[condimen]

Ah ha! I’m so stupid hahah. The thing that was troubling me was that in the inspector doesn’t appear the < and &gt, so I thought there was a way to avoid using the entities.
Thanks both of you for your help!

[Author]

Posts