Solved

Code view

Posted on 2013-06-04
5
181 Views
Last Modified: 2013-06-27
I'm trying to figure a way of showing CSS / HTML and javascript code in a page,  I've managed to get the html code to show how I want but want to put it in a scrolling windows.

I thought I could try and use an iFrame, but its a bit of a mess making another page to pull the html in, eg:-
<iframe src="mycode.php"></iframe> 

Open in new window


What I would have preferred to use is:-
<iframe><strong>Hello</strong><I>Test</I></iframe> 

Open in new window


However it doesn't show the html inside.

I read an article that used a textArea to put html code inside, but using the code just puts the raw html in (without highlighting):-
<textarea><strong>Hello</strong><I>Test</I></textarea>

Open in new window


Experts-exchange seem to be able to do it (without highlighting).

How does everyone else do it?
0
Comment
Question by:tonelm54
5 Comments
 
LVL 33

Expert Comment

by:paulmacd
ID: 39220234
Replace the open and close brackets with &gt; and &lt;.  This will allow you to display the markup but not cause the browser to interpret it as HTML.
0
 

Author Comment

by:tonelm54
ID: 39220240
As a textarea or iframe?
0
 
LVL 23

Accepted Solution

by:
tailoreddigital earned 500 total points
ID: 39220243
0
 
LVL 33

Expert Comment

by:paulmacd
ID: 39220274
I'm sorry, I misunderstood the question.  [tailoreddigital]'s <code> tag may be the way to go.
0
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39220304
You can also just convert non alpha numeric's to entities http://www.webmaster-toolkit.com/html-entity-chart.shtml

Then place all of that in a div with a height class set to overflow scroll.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now