It seems to work properly on all of my browsers. However, the bit of HTML code in the header box that has left and right boxes are not so super logical to me.

I would like to put the left box code before right box code, but then it does not render the thing it right.

Anyway, do 'yall think this is correct and there is no problem with my layout here?

Thanks,

Code HTML4Strict:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <title>test</title>
    <style type="text/css">
        .layout {
            width:768px;
            margin-left:auto;
            margin-right:auto;
            border:1px solid black; /* dev */
        }
 
        div.header div.left {
            width:45%;
            background:red; /* dev */
        }
 
        div.header div.right {
            float:right;
            width:45%;
            text-align:right;
            background:green; /* dev */
        }
    </style>
</head>
<body>
    <div class="wrap">
        <div class="layout header">
            <div class="right">header right</div> <!-- hmm... right first? -->
            <div class="left">header left</div>
        </div>
 
        <div class="layout splash">
            splash
        </div>
 
        <div class="layout content">
            content
        </div>
 
        <div class="layout footer">
            footer
        </div>
    </div>
</body>
</html>