DaniWeb IT Discussion Community - Keeping it in the box

In this html file I created an area called “branding” where I wanted my name at least at first flush left in the middle of the branding area. The elements behave differently in IE Release candidate 1 than in Firefox. I assume Firefox is correct but how do I get both to behave like IE where the text is:
1) In the middle of the box.
2) Flush left top of box
3) Flush left bottom of the box.
I would be thankful for you assistance.
The code follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

        <head>

                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

                <title>Untitled Document</title>

<style type="text/css">

/* Branding Text */

.branding{

    font-family: Constantia,

                "Lucida Bright", Lucidabright,

                "Lucida Serif", Lucida,

                "DejaVu Serif", "Bitstream Vera Serif",

                "Liberation Serif", Georgia, serif;

    font-style: italic;

    font-size: 30pt;

    color: red;

    font-weight: bold;

    text-decoration: none;

    text-align: left;

}

body {

    background-color: #000000;    

}

#wrapper {

    margin: 0 auto;

    margin-top: 2px;

    padding: 0px;

    width: 800px;

    min-height: 800px;

    background-color: #000000;

}



#branding {

    padding: 0;

    width: 800px;

    height: 60px;

    clear: both;

    background-color: #CCCCCC;

    border: inset;

}

</style>        

        </head>

        <body>

        <div id='wrapper'>

            <div id='branding'>

                <p class='branding'>William Bradley Rouse</p>

            </div>

        </div>    

        </body>

</html>

WBR