pie de página que ocupe 100% width

Citar

Escrito el 21 Dic 2009 10:15 pm

Hola,
estoy haciendo un sitio web, y necesito que halla una especie de pie de página como el de esta página: http://www.desarrolloweb.com/ en el bottom de la página hay una imágen que tiene copyright etc. Y esa imágen ocupa el 100% width por asi decirlo, he intentado hacerlo pero no he podido, alguien me puede decir cómo hacerlo?
Hasta luego!
Muchas Gracias!

Por hormy1

Claber

124 de clabLevel

Envíale un mensaje privado Email

Citar

Escrito el 22 Dic 2009 04:57 am

Es una imágen que se repite horizontalmente.

Se logra con CSS

Ej.

CSS:
#footer{
background:url(images/imagen.jpg) repeat-x top white;
width:100%;
}

HTML:

<div id="footer">
<p>hola mundo</p>
</div>

Por elfleat

871 de clabLevel

2 tutoriales

Genero:Masculino

Envíale un mensaje privado Email Web

Miami, USA

@elfleat

Citar

Escrito el 22 Dic 2009 06:26 am

Hola!,
gracias por responder

mmm lo probe pero no llena el 100% del navegador quedan como 3 o 4 pixeles en la derecha e izquierda sin rellenar y tambien en la parte inferior

no se que hacer

,
Hasta Luego!
Gracias!

Por hormy1

Claber

124 de clabLevel

Envíale un mensaje privado Email

Citar

Escrito el 22 Dic 2009 06:27 am

Publica el código,

Probablemente está heredando márgenes.

Por elfleat

871 de clabLevel

2 tutoriales

Genero:Masculino

Envíale un mensaje privado Email Web

Miami, USA

@elfleat

Citar

Escrito el 22 Dic 2009 06:49 am

mira:
no puse el footer en la tabla que organiza la página para que no quedara centrado ....
[code]
<!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=utf-8" />
<link rel="shortcut icon" href="favicon.ico" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Doc</title>
</head>

<body>
<center>
<table>
<tr>
<td colspan="3">

<div align="center">
<img class="shadowedObject" src="textura2.jpg" width="176" height="83" />
<p class="foregroundText">
</p>
</div>

</td>
</tr>
<tr>
<td>

<div align="right">
<a href="http://www.google.com" class="aMenu">Inicio </a><br /><br />
<a href="http://www.google.com" class="aMenu">Quien soy </a><br /><br />
<a href="http://www.google.com" class="aMenu">Imágen Corporativa</a><br /><br />
<a href="http://www.google.com" class="aMenu">Material Publicitario</a><br /><br />
<a href="http://www.google.com" class="aMenu">Diseño Editorial </a><br /><br />
<a href="http://www.google.com" class="aMenu">Diseño Web </a><br /><br />
<a href="http://www.google.com" class="aMenu">Ilustración </a><br /><br />
<a href="http://www.google.com" class="aMenu">Diseño Multimédia </a><br /><br />
<a href="http://www.google.com" class="aMenu">Contácteme </a><br /><br />
</div>

</td>
<td width="700">

<div align="center" class="centeredObject">
<div align="left"><p class="bodyText">  Inicio</p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
<p class="bodyText"> </p>
</div>

</div>

</td>
<td>

<div align="center">

</div>

</td>
</tr>
<tr>
<td colspan="3">

</td>
</tr>
</table>
</center>

<div id="footer">
Hola mundo
</div>

</body>
</html>
[code]

y el css:

[code]
@charset "utf-8";
/* CSS Document */
body{
background:url(bg2.jpg);
height:100%;
}
@font-face{
font-family: "Amerika Sans";
src: url("http://www.kimberlycastro.zxq.net/Amerika_Sans.ttf");
}
.foregroundText{
font:15px "Amerika Sans";
color:#FFFFFF;
}
.bodyText{
font:14px Arial, Helvetica, sans-serif;
color:#333333;
}
.centeredObject{
background:url(centeredImg.jpg);
border:double #333333;

}
.aMenu{
font:14px Arial, Helvetica, sans-serif;
text-decoration:none;
color:#FFFFFF;
border-left:solid 8px #aaaaaa;
background:url(btnImg.jpg);
padding:5px;
cursor:default;
white-space:pre;
}
.aMenu:hover{
font:14px Arial, Helvetica, sans-serif;
text-decoration:none;
color:#FFFFFF;
border-left:solid 8px #dddddd;
background:url(btnImg2.jpg);
padding:5px;
cursor:default
white-space:pre;
}
#footer{
background:url(bottom.jpg) repeat-x top white;
margin-bottom:-4px;
margin-left:-7px;
width:100%;
}
[/code]

muchas gracias