Positioning Text Inside a Triangle CSS - html

Question

So assuming I have the below triangle. Without adding any html or tags how could I go about positioning the text into the center of the triangle?
Fiddle: http://jsfiddle.net/3LXaD/
You will notice the white text in the top right corner of the triangle. I understand a triangle is a large border around the shape. Is this even possible?
CSS
div:nth-of-type(1) {
width: 0;
height: 0;
border-style: solid;
border-width: 0 150px 130px 150px;
border-color: transparent transparent #d30000 transparent;
line-height: 0px;
_border-color: #000000 #000000 #d30000 #000000;
_filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
}
div {
font-size: 16px;
color: #FFFFFF;
text-align: center;
}
HTML
<div>This is a triangle</div>

Answer 1

Without extra markup try this:
div:nth-of-type(1):before {
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 0 150px 130px 150px;
border-color: transparent transparent #d30000 transparent;
line-height: 0px;
_border-color: #000000 #000000 #d30000 #000000;
_filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
position: absolute;
top: 0;
z-index: -1;
left: 50%;
margin-left: -150px;
}
div {
font-size: 16px;
color: #ffffff;
text-align: center;
line-height: 130px;
position: relative;
}
Here is an example.
Ciao
Ralf

Answer 2

Wrap the text in the span and position it absolutely:
JSfiddle
span{
position: absolute;
top: 80px;
left: 33%;
}
<div><span>This is a triangle</span></div>
Here would be the solution if you were to use a pseuedo element. (not best practice)
div:after{
content: 'This is a triangle';
color: white;
position: absolute;
top: 80px;
left: 33%;
}