Header con CSS

matias_80 · #1 (**permalink**) 13/03/2008, 06:28

Hola amigos necesito de su ayuda!!

Estoy diseñando un template y tiene un header, un contenido(donde ira la info) y un footer.....

Estoy por la parte del header y lo q tengo son 1 imagen, 1 swf y otra imagen, y quiero q me quede todo junto y no se porque se me esta deformando todo!!

Aqui les pongo el codigo

#header {
background-color: #ffffff;
height:250px;
width:100%;
padding: 0px;
margin: 0px;
border:0px none;
}

<body>
<div id="container">

<div id="header">
<img src="logo.jpg" width="286" height="250" border="0"/>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="694" height="225" id="animacion" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="animacion.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="animacion.swf" quality="high" bgcolor="#ffffff" width="694" height="225" name="animacion" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<img src="img_der.jpg" width="18" height="200" border="0"/>
</div>

<div id="content"> </div>
<div id="footer"> </div>
</div>
</body>

La pregunta es como hago para q el header me quede todo junto y bien!!

Muchas gracias

Raulmmmm · #2 (**permalink**) 13/03/2008, 06:55

Ponle a las imágenes, y al object el atributo style="float: left", y antes de que acabe el div pones esto:
<div style="clear: both"></div>

matias_80 · #3 (**permalink**) 13/03/2008, 07:10

hola amigo gracias por tu ayuda pero hice lo q me sugeristes pero sin sin funcionar, mira el codigo

#header {
background-color: #ffffff;
height:250px;
width:100%;
padding: 0px;
margin: 0px;
float: left;
}

<div id="header">
<img src="logo.jpg" width="286" height="250" border="0"/>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="694" height="225" id="animacion" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="animacion.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="animacion.swf" quality="high" bgcolor="#ffffff" width="694" height="225" name="animacion" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<img src="img_der.jpg" width="18" height="200" border="0"/>
<div style="clear: both"></div>

</div>

Raulmmmm · #4 (**permalink**) 13/03/2008, 07:29

No, así no, te dije así (perdón si no me entendistes):

Código:

#header {
background-color: #ffffff;
height:250px;
width:100%;
padding: 0px;
margin: 0px;
}

Código HTML:

<div id="header">
<img src="logo.jpg" width="286" height="250" border="0" style="float: left" />
<object style="float: left" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="694" height="225" id="animacion" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="animacion.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="animacion.swf" quality="high" bgcolor="#ffffff" width="694" height="225" name="animacion" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<img src="img_der.jpg" width="18" height="200" border="0" style="float: left" />
<div style="clear: both"></div>

</div>

matias_80 · #5 (**permalink**) 13/03/2008, 07:36

Buenisimo!!!!! amigo gracias!!

Ahora quisiera q las tres imagenes quedaran en el bottom, porque me queda todo en el top.

que style iria probe con vertical-align:bottom; y no funciono!

gracias!

Raulmmmm · #6 (**permalink**) 13/03/2008, 07:42

Para eso, pon un margin-top: 60px; o algo así, ve variando el número de píxeles hasta que te quede bien.

matias_80 · #7 (**permalink**) 13/03/2008, 07:50

Hola amigo, mira aca puse el ejemplo para q lo veas
http://www.tierragreda.com.ar/prueba/layout.html

mira la animacion como me queda! me queda arriba probe con lo q me dijistes y no funciona.....

#header {
background-color: #ffffff;
height:250px;
width:100%;
padding: 0px;
margin: 0px;
}

<div id="header">
<img src="logo.jpg" width="286" height="250" border="0" style="float: left" />
<object style="float: left" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="694" height="225" id="animacion" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="animacion.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="animacion.swf" quality="high" bgcolor="#ffffff" width="694" height="225" name="animacion" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<img src="img_der.jpg" width="18" height="200" border="0" style="float: left;margin-top: 50px;" />
<div style="clear: both"></div>

</div>

Raulmmmm · #8 (**permalink**) 13/03/2008, 14:17

No me sale tu página... de todas maneras también puedes probar con padding-top: 50px; o line-height: 50px;.

wil1 · #9 (**permalink**) 19/05/2009, 09:37

hola buenos dias yo tengo un problema similar, tengo un header en flash q se puede ver en firefox pero no en IE.

porfavor si me dan una ayuda! con esto.!

aqui les dejo el link para q bajen los archivos .css e index ,para q vean cual es mi error

:

www . anipan . org

10000 gracias de antemano!