Ayuda con Pie de Pagina!

Buenas necesito saber si alguien puede ayudarme para terminar el pie de pagina de mi web , ya que tengo inconveniente en dos puntos:

1. Quiero que mi color de fondo elegido para mi pie de pagina sea transparente, yo se como poner el codigo para lograrlo pero al hacerlo tambien me pone transparente el contenido que tengo en mi pie de pagina, por lo cual precisaria saber si alguien pude decirme el lugar donde poner la especificacion para la transparencia del fondo pero no del contenido.

2. Como lograr que el pie de pagina quede al final de mi web, independientemente de lo que ocupe el contenido.


Les dejo el codigo html y css para que vean como lo deje diseñado hasta le momento:

CODIGO HTML:

<!--Comienzo pie de pagina-->

<div id="pie">

<div id="piedos">© Webmaster Arte Grafico - e-mail: ************ - Tel. +++++++</div>
<div id="pietres"><a href="http://www.facebook.com/ArteGraficobb" target="_blank"><img src="Objetos/Iconos/icontexto-inside-facebook.png" width="64" height="58" /></a></span></div>
</div>


</div>


CODIGO CSS:

#pie {background-color:#666;
border-top: solid 2px #000;
height: 65px;width:1347px;}


#piedos { font:Tahoma; color:white;float:left; width:700px; margin: 20px 30px 40px 400px;}
#pietres { float:left;width:150px; margin: 5px;}

Hola:

1.- El fondo transparente es background-color: transparent;.
2.- Simplemente pon el <div id="pie"> y todo su contenido justo antes de la etiqueta </body>. Ahora, si los elementos anteriores utilizan float: left|right, entonces debes especificar esta propiedad al pie: #pie { clear: both; }, de esta manera no se posicionará al lado. Por otro lado, si tu problema es que el contenido utiliza 300 pixeles de alto, por ejemplo, y el pie parece no quedar "al pie", entonces puedes posicionar el pie al final:

#pie {
  position: absolute;
  bottom: 0;
  left: 0;
  /* Resto de las propiedades */
}

Suerte y espero que te sirva :).

Gracias skaparate por tu ayuda, te cuento que no tuve suerte con ninguna de las dos opciones que vos me das para el pie, por lo cual opte por tomar una captura de pantalla para que veas mejor lo que me pasa con el pie. La dejo a continuacion:



Como se aprecia en la imagen hay mas lugar hasta llegar al final de la web, ya que se ve que la barra de scroll lateral todavia tiene mas espacio hasta llegar al final de la pagina.

Y por otro lado en cuanto a lo del fondo transparente, no me explique bien, quiero que tenga un fondo gris pero que este sea medio transparente para que se vea el fondo, en el menu de la imagen se ve claramente lo que quiero, el tema es que como te comentaba cuando pongo la opacidad tambien me lo aplica a el contenido del pie.

Espero puedan orientarme!

Hmmmm...

Para la transparencia:

#pie {
  opacity: 0.9;
  filter: alpha(opacity=90); /* Este es para Internet explorer - para variar */
}

Si deja transparente los elementos dentro del pie, entonces añade esto después de la anterior:

#pie * {
  opacity: 1;
  filter: alpha(opacity=100);
}

Para el problema del pie:

1.- Copia esto en tu hoja de estilos:

/* For modern browsers */
.cf:before, .cf:after {
	content: "";
  display: table;
}

.cf:after {
  clear: both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
  *zoom: 1;
}

2.- Añade la clase cf al pie: <div id="pie" class="cf">CONTENIDO</div>.

Esa clase (cf) debes añadirla a cualquier elemento que contenga elementos flotando (float: left|right). Es una técnica para corregir un bug en los navegadores que impide que los ancestros de elementos flotando tengan un tamaño.

Si eso no baja el pie hasta el final, entonces puede ser que estés utilizando una imagen (<img>) como fondo y que esta sea más grande que la pantalla, por ende siempre habrá espacio después del pie.