<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#container{
margin:0px;
padding:0px;
width:102px;
background-color: #ff0000;
border: 1px solid black;
voice-family: "\"}\"";
voice-family:inherit;
width:100px;
} html>body #container{width:100px;}
#sx{
margin:0px;
padding:0px;
float:left;
width:30px;
height:50px;
background:#aaa;
float:left;
display: inline;
}
#dx{
margin:0px;
padding:0px;
width:70px;
height:50px;
background:#e6e6e6;
float: left;
}

</style>
</head>

<body>
<div id="container">
<div id="sx">sx</div>
<div id="dx">dx</div>
</div>
</body>
</html>

potresti adottare questa soluzione,
però giustamente con firefox il contenitore
non si estende sotto i div sx e dx.

dovresti aggiungere un altro elemento che faccia il clear del float