Hola
Veamos, si agregas un borde a la lista, verás que firefox tampoco te lo muestra realmente bien ya que los elementos con float están fuera de la lista.
Si lo que quieres es que estén en la misma línea, lo que has de hacer es cambiar su tipo de display, de block a inline.
Aquí te dejo un ejemplo:
Código HTML:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
#lista {
list-style:none;
border: 1px solid #f00;
width: 70px;
}
#lista .junto {
display: inline;
}
</style>
<script type="text/javascript">
</script>
<title>prueba</title>
</head>
<body>
<ul id="lista">
<li>especial #1</li>
<li>especial #2</li>
<li class="junto">#1</li>
<li class="junto">#2</li>
<li class="junto">#3</li>
<li class="junto">#4</li>
<li class="junto">#5</li>
<li class="junto">#6</li>
<li class="junto">#7</li>
<li class="junto">#8</li>
<li class="junto">#9</li>
</ul>
</body>
</html> Obviamente, al ser inline, todos irán a la misma línea, po lo que debes controlar las dimensiones del formulario para que salten cuando sea necesario.
En cualquier caso, si lo que te interesa es realmente la semántica, si los tres elementos deben estar en la misma línea, significa que son la misma opción, por lo que deberían ser un solo elemento de lista.
Felicidad