Horizontally and Vertically Center a Pre Tag Without the Use of Tables

Horizontally and vertically center a pre tag without the use of tables?

Throw er in a div and center that div one of these ways http://tutorialzine.com/2010/03/centering-div-vertically-and-horizontally/

Vertically align a PRE block within a TD to Top

Vertical align is for td and not for pre

table td.preBlock{
vertical-align:top;
}

table td pre{
color: red;
font: normal 16px Arial;
}

Then you can do

<td class="preBlock">

Fiddle

Edit:

Seems to work for me even that way, just reduce margin-top. See here

Fiddle2

How to vertically center/align text next to pre tag

You just need to remove float: right and add display: inline

Vertically center unknown length of text inside a div

I've updated your fiddle:

It seems to work

see: http://jsfiddle.net/hSCtq/11/ for reference.

I would put .TileText inside of .background. Creating an empty div for the sake of a background image is not semantically correct, and not necessary in most situations. One situation for a separate background div would be if you need to set the opacity of a background image separately from the content.

<div class="background">
    <div class="TileText">MyText - Another long, long, long text</div>
</div>

.background {
    background-color:#000;
    height: 400px;
    width: 100%;   
    display: table
}

.TileText{
    max-width: 200px;
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    clear: both;
    padding-left: 10px;  
}

How to align a div to the middle (horizontally/width) of the page

<body>
    <div style="width:800px; margin:0 auto;">
        centered content
    </div>
</body>

center tag not centering in IE7

Don't use center tag, it's deprecated. Use CSS instead. You can do something like this:

<td style="text-align:center">data</td>

You forgot to add tag inside your . If you want to study the anatomy of a table go here http://w3schools.com/html/html_tables.asp

<tr> 
    <td style="text-align:center">
        <span class='spn_big_lightblue_rbc'>RAINBOW</span>
    </td>
    <td style="text-align:center">
        <span class='spn_big_black_rbc'>CODE</span> 
    </td>
</tr> 
<tr> 
    <td style="text-align:center" colspan="2">
        <span class='spn_med_yellow_rbc' style="margin-left:auto;margin-right:auto;">THANK YOU,YOUR FORM HAS BEEN SUBMITTED</span> 
    </td>
</tr>

Also, don't use table for layout. Table is intended for tabular data, use CSS instead.

pre tag inside class

I don't know how your code looks like but i think this will help you.

You could give the class you're using vore the text on the left a margin-right:50%; in your css.

p.maintext_left {
    text-align: justify;
    margin-right:50%;
}

If this doesn't help you please show me your code.

Horizontally and Vertically Center a Pre Tag Without the Use of Tables