Comunidad PHPeros

Lenguajes => CSS => Mensaje iniciado por: judoka en 29 de Agosto de 2009, 23:12:46 pm

Título: Colocar alineado
Publicado por: judoka en 29 de Agosto de 2009, 23:12:46 pm

¡¡ SOLUCIONADO !!

Espero entiendan con esta imagen el problema:

http://img38.imageshack.us/img38/3369/dibujovyh.png

Bueno, si no lo entendieron... quiero colocar el contenido que pone publicidad alineado.. seria mas bien asi:

 ----------      -------------------
|             |     |                         |
|             |     -------------------
 ----------     
 ----------
|             |
|             |
 ----------

no como en la imagen que sale en el quinto pino... :S

este es el codigo:

Código: [Seleccionar]

<div id="header">
<div align="center">
  <p><strong>Club de Hockey Xaloc  </strong></p>
  </div>
</div>

<div id="publicidad"></div>
<div id="navegador-top"></div>
<div class="nav" id="navegador"><strong>
  Noticias<br />
      Descargas<br />
      Im&aacute;genes<br />
      Informaci&oacute;n<br />
  Equipos  
</strong></div>
 
<div id="panel-top"></div>
<div id="panel">
<form method="post" action="">
<table>
<tr><td><strong class="nav">User:</strong></td>
<td><input type="text" name="usuer" size="14" /></td></tr>
<tr><td><span class="nav">Pass:</span></td>
  <td><input type="password" name="pass" size="14" /></td></tr>
</table>
<table width="127">
<tr><td width="60"><div align="center">
  <input type="reset" value="Borrar" />
</div></td><td width="55"><div align="center">
  <input type="submit" name="ok" value="Entrar" />
</div></td></tr>
</table>
<span class="nav"><a href="index.php?url=Registro">&iexcl;Registrate!
</a></span>
</form>
</div>

<a href="http://www.chxaloc.com"><div id="link"></div></a>

<div id="link2"></div>

<div id="link3"></div>

<div id="contenido">
Hola
</div>y el css:

Código: [Seleccionar]

/* CSS Document */
a {
color:#FFF;
text-decoration:none;
}
body{
    margin-left: 30px;
margin-right: 30px;
}

#header{
width: 725px;
background-color: #990000;
height: 80px;
}

#navegador-top{
width: 163px;
height: 26px;
margin-top: 5px;
background-image:url(images/Navegador-arriba.png);

}
#panel-top{
width: 163px;
height: 26px;
margin-top: 5px;
background-image:url(images/Panel-arriba.png);
}
#navegador{
width: 157px;
height: 109px;
padding: 3px;
background-image:url(images/navegador.png);
}

#panel{
width: 157px;
height: 109px;
padding: 3px;
background-image:url(images/navegador.png);
}

#link{
    margin-top: 5px;
    width: 163px;
height: 26PX;
border: 0.1mm solid black;
background-color: #FF9900;
background-image:url(images/Link%20Foro.png);
}

#link2{
    margin-top: 5px;
    width: 163px;
height: 26PX;
border: 0.1mm solid black;
background-color: #FF9900;
    background-image:url(images/Link%201.png);
}

#link3{
    margin-top: 5px;
    width: 163px;
height: 26PX;
border: 0.1mm solid black;
background-color: #FF9900;
    background-image:url(images/Link%202.png);
}

#contenido{
    width: 440px;
height: 327px;
border: 0.1mm solid black;
background-color: #CCCCCC;
}

#publicidad{
width: 440px;
height: 50px;
background-image:url(images/Publicidad.png);
border: 0.1mm solid black;
margin-top: 5px;
margin-bottom: 5px;
float: right;
}

#Copyright{
width: 630px;
height: 30px;
background-image:url(images/Copyright.png);
border: 0.1mm solid black;
    Margin-top: 5px;
}
.nav {
color: #FFF;
font-weight: bold;
}

a ver si me pueden ayudar :)

ademas si me pudierais decir como colocar todo eso para que aunque cambies la resolucion se vea igual... mucho mejor y os dare un +1 :)