Problema con alineado

[ArturoGallegos]

te la complicaste mucho hubiera bastado con cambiar una sola linea de tu css

cambia:

Código CSS:

#foot li {
    float: left;
    margin: 0;
    padding: 0;    
}
 

por:

Código CSS:

#foot li {
    display:inline;
    margin: 0;
    padding: 0;    
}
 

y después esos span que usaste para marcar la separación no me gustan jeje creo que queda mejor si los colocas en un li separado

Código HTML:

<ul>
    <li>Logotipo</li>
    <li> | </li>
    <li>© www.host.com.ar</li>
    <li> | </li>
    <li>Todos los Derechos Reservados</li>
</ul>
 

PD. aclaro que se centra en relación al #foot y este solo ocupa la mitad del ancho total por lo que no se aprecia del todo que este centrado hasta que le pongas un color de fondo diferente al foot o un borde