Div dentro de otro Div

[besotico]

Amigos, busqué información por internet y en este foro en especifico antes de realizar la pregunta, había alguien aquí que pregunto algo similar, pero no tuvo respuesta :(


Así que espero puedan sanara esta duda que he tenido siempre, aquí vamos...

Mi Body es

Código CSS:

body {
    text-align:center;
}
 

Tengo mi primer div un wrapper centrado, su codigo es

Código CSS:

#wrapper {
    margin:0 auto 0 auto; 
    width:970px; 
}
 

Esto ultimo es para que quede siempre centrado al navegador.

El wrapper efectivamente me queda centrado, y si yo coloco algo dentro solo las cosas alineadas a la izquierda hacen el 'resize' respectivo si cambio la resolucion del navegador.

esto es lo que tengo a la izq.

Código CSS:

#logo {
    position:absolute;
    left:auto;
    top:14px;
    width:214px;
    height:48px;
    z-index:2;
}
 

Entonces como el left de logo esta en auto, me queda alineado al div wrapper y si cambia la ventana logo y wrapper sufren modificaciones en posicion, se entiende hasta aca verdad?

El drama es con lo que sigue no puedo hacer que nada calze a la derecha, siempre todo dentro del div wrapper por eso los zindex.

Aqui mi html

Código HTML:

<div id="wrapper">
<div id="logo"></div>
<div id="buscador"></div>
</div>
 

buscador es lo que intento dejar en right:0; pero del div wrapper no del navegador, ojala me pueda ayudar por que así tal cual no funciona.