Tema: Ayuda, acomodar header y body
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/12/2010, 18:21
SonrisaCs
 
Fecha de Ingreso: diciembre-2010
Mensajes: 180
Antigüedad: 13 años, 4 meses
Puntos: 5
Ayuda, acomodar header y body
Hola gente :P, Tengo unos problemitas con mi host de img
Para empezar xD, Cuando entras ([URL="http://www.iron-services.com.ar/imagehost/"]http://www.iron-services.com.ar/imagehost/[/URL]) Hay 3 problemas,

1.- El formulario de Login y el boton de registro estan casi en el medio... Yo quisiera que esten totalmente a la derecha, estube por horas tratando de ubicarlo bien pero no pude u.u

2.- Hay una box que sobresale, la medida tendria que ser 900, pero llega como a los 960, y no puedo arreglarlo de ninguna forma :S

3.- en las "Imagenes al azar" hay mucho espacio entre cada una, por lo tanto sobresalen... Y no tengo idea de como arreglarlo :S

Header.php:
Código PHP: 
Ver original
  1. <?php
  2.  $page = basename($_SERVER['PHP_SELF']);
  3.  ?>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6.  <head>
  7.  <title>Iron Host - Hosting de Archivos gratuito</title>
  8.  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  9.  <link rel="stylesheet" type="text/css" href="./styles.css" /></head>
  10. <Style>
  11. body {
  12.  margin: 0;
  13.  padding: 0;
  14.  color: white;
  15.  background: url(dot.jpg);
  16.  font: 9pt Arial, sans-serif;
  17. }
  18. #wrapper {
  19.  background: #ffffff;
  20.  color: black;
  21.  margin: 20px auto 0 auto;
  22.  padding: 0px;
  23.  border: 1px solid #000000;
  24.  width: 900px;
  25. }
  26. #footer {
  27.  font-size: 10px;
  28.  text-align: center;
  29.  margin: 10px auto 10px auto;
  30. }
  31. #terminator {
  32.  background: url(terminator_back.png) repeat-x;
  33.  height: 15px;
  34.  margin: 0 0 0 0;
  35.  border: 0;
  36. }
  37. #header {
  38.  border-bottom: 1px solid #000000;
  39.  margin: 0px;
  40.  height: 185px;
  41. }
  42. #header .left {
  43.  background: #ACC4CE url(back_left.jpg);
  44.  width: 100px;
  45.  float: left;
  46.  height: 136px;
  47.  margin: 0px; 
  48. }
  49. #header .right {
  50.  background: #ACC4CE url(back_right.jpg);
  51.  width: 800px;
  52.  float: left;
  53.  margin: 0x;
  54.  height: 136px;
  55.  padding: 0px;
  56. }
  57. #header-bottom {
  58.  border-top: 0;
  59.  border-bottom: 0;
  60.  background: #ffffff;
  61.  margin: 0 0 0 0;
  62. }
  63. #main {
  64.  position: relative;
  65.  margin: 10px;
  66. }
  67. #content {
  68.  margin: 0 0 0 0;
  69.  border-style: none;
  70.  border-width: 0 0px 0px 0;
  71.  background: white;
  72.  color: black;
  73. }
  74. #content .inner {
  75.  margin: 0px 0px 0px 0px; 
  76. }
  77. #content .inner a {
  78.  color: #0B7BCC;
  79.  text-decoration: underline;
  80. }
  81. #content .inner a:hover {
  82.  color: #0B7BCC;
  83.  text-decoration: none;
  84. }
  85. #content .inner h2 {
  86.  color: #245185;
  87.  padding-bottom: 0.2em;
  88.  border-bottom: 1px solid #b9d2e3;
  89.  font-size: 120%;
  90. }
  91. #content .inner h3 {
  92.  font-size: 130%;
  93. }
  94. #content .inner p {
  95.  color: #666666;
  96.  font-size: 100%;
  97. }
  98. #content .inner hr {
  99.  background-color: #444444;
  100.  height: 1px;
  101.  margin: 2px;
  102.  border: 0;
  103. }
  104. #content .inner textarea {
  105.  font-size:9px;
  106.  font-family:Verdana, Arial, Helvetica, sans-serif;
  107. }
  108. ul.dropdown {
  109.  list-style: none;
  110.  margin:0;
  111.  padding:0;
  112.  width:100%;
  113. }
  114. ul.dropdown * ul {
  115.  list-style: none;
  116.  margin:0;
  117.  padding: 0;
  118.  display:none;
  119.  position:absolute;
  120.  z-index:99;
  121. }
  122. ul.dropdown li {
  123.  float: left;
  124.  padding: 0px; /* padding: 2px; helps Opera with hover */
  125. }
  126. ul.dropdown li * li {
  127.  float: none;
  128.  position: relative;
  129. }
  130. ul.dropdown ul * ul {
  131.  left:98%;
  132.  top:0;
  133.  width:100%;
  134. }
  135. ul.dropdown a {
  136.  display:block;
  137. }
  138. ul.dropdown ul * a {
  139.  width:20em;
  140. }
  141. ul.dropdown li:hover ul ul, ul.dropdown li:hover ul ul ul, ul.dropdown li:hover ul ul ul ul {
  142.  display:none;
  143. }
  144. ul.dropdown li:hover ul, ul.dropdown ul li:hover ul, ul.dropdown ul ul li:hover ul {
  145.  display:block;
  146. }
  147. ul.dropdown a {
  148.  background-color: #666666;
  149.  color: #fff;
  150.  padding: 2px 9px 2px 9px;
  151.  text-decoration: none;
  152. }
  153. ul.dropdown a:hover {
  154.  background-color: #666666;
  155.  color: #fff;
  156. }
  157. ul.dropdown ul {
  158.  border: 0;
  159.  background-color: #ccc;
  160. }
  161. ul.dropdown ul a {
  162.  background-color: #ccc;
  163.  color: #000;
  164.  padding: 4px;
  165.  text-decoration: none;
  166. }
  167. ul.dropdown ul a:hover {
  168.  background-color: #E1E1E1;
  169.  color: #000;
  170. }
  171. ul.dropdown ul li {
  172.  background-color: #ccc;
  173. }
  174. ul.dropdown hr {
  175.  background-color: #444444;
  176.  height: 1px;
  177.  margin: 3px;
  178.  border: 0;
  179. }
  180. #mainmenu {
  181.  background: url(terminatr_back.png) #666666 repeat-x;
  182.  height: 20px;  
  183. }
  184. input, textarea { 
  185.  margin-right: 10px;
  186.  margin-top: 4px;
  187.  font: normal 11px verdana, arial, geneva, helvetica, sans-serif;
  188. }
  189. form {
  190.  line-height: 150%;
  191. }
  192. #uploadfield {
  193.  margin: 20px auto 10px auto;
  194.  padding: 0px;
  195.  width: 800px;
  196. }
  197. #premiumloginform {
  198.  margin: 20px auto 10px auto;
  199.  padding: 0px;
  200.  width: 200px;
  201. }
  202. #freefoldersform {
  203.  margin: 20px auto 10px auto;
  204.  padding: 0px;
  205.  width: 540px;
  206. }
  207. #premiumtable {
  208.  border-left: 1px solid #BFBFBF;
  209.  border-bottom: 1px solid #BFBFBF;
  210.  margin: 20px auto 10px auto;
  211.  padding: 0px;
  212.  width: 600px;
  213. }
  214. #premiumtable2 {
  215.  border-left: 1px solid #BFBFBF;
  216.  border-bottom: 1px solid #BFBFBF;
  217.  margin: 20px auto 10px auto;
  218.  padding: 0px;
  219.  width: 700px;
  220. }
  221. #premiumtable td {
  222.  border-right: 1px solid #BFBFBF;
  223.  border-top: 1px solid #BFBFBF;
  224. }
  225. #premiumtable2 td {
  226.  border-right: 1px solid #BFBFBF;
  227.  border-top: 1px solid #BFBFBF;
  228. }
  229. #content .inner .resellergroup {
  230.  color: #245185;
  231.  padding: 10px;
  232.  border-top: 2px solid #cccccc;
  233.  font-size: 120%;
  234.  font-weight: bold;
  235.  margin: 10px;
  236. }
  237. #content .inner .resellergroup .reseller {
  238.  color: #666666;
  239.  font-size: 90%;
  240.  margin: 10px 10px 20px;
  241.  font-weight: normal; 
  242. }
  243. .Estilo2 {color: #FFFFFF}
  244. .Estilo4 {font-size: 9pt}
  245. </Style>
  246.  
  247.  </head>
  248. <body>
  249.  
  250. <div id="wrapper">
  251.  
  252. <div id="header">
  253. <img src="logo-right.jpg" width="900" height="185"></div>
  254.  
  255. <ul class="dropdown Estilo2" id="mainmenu">
  256. <li class="Estilo4">
  257.   <div align="center"><a href="index.php">Home</a></div>
  258. </li>
  259.  <li></li>
  260.  
  261.  <li></li>
  262.  
  263.  <li class="Estilo4"><a href="/imagehost">Imagehost</a> </li>
  264.  
  265.  <li class="Estilo4"><a href="/archivehost">Archivehost</a></li>
  266.  
  267.  <li class="Estilo4"><a href="index.php">Contacto  </a></li>
  268.  
  269.  <li></li>
  270.  
  271.  <li></li>
  272.  
  273.  <li></li>
  274.  
  275.  
  276.   <div align="right">
  277.     <?php if($session==true):?>  
  278.     <?php
  279.           
  280. echo        "Bienvenido $username ! &nbsp;&nbsp";
  281.             "<a href='account.php?act=logout' style='FONT-SIZE: 14px'>Salir</a>";
  282.             "&nbsp;&nbsp;<a href='account.php?act=logout' style='FONT-SIZE: 14px'>Salir</a>"
  283.  
  284.         ?>
  285.      <a href="account.php?act=logout">Salir</a>
  286.     <?php else: ?> 
  287.     </div>
  288.   <li><form action="login.php" method="POST">
  289.       
  290.       
  291.       <div align="right">
  292.         <table align="right" bgcolor="#666666">
  293.           <tr class="dropdown">
  294.             <td align="right">Usuario: 
  295.               <input type="text" name="username" size=10></td>
  296.             <td align="right">Password: 
  297.             <input type="password" name="password" size=10> </td>
  298.             <td align="right"><input type="submit" value="Entrar" name="login"> </td>
  299.             <td width=100 align="right"> <center><a href="register.php" title="Click here to join now!">
  300.                 <img src="images/join.gif" border=0 onmouseover="this.src='images/join1.png';" onmouseout="this.src='images/join.gif';">
  301.                 </a> </center>
  302.         </table>
  303.       </div>
  304.   </form> 
  305.       
  306.     
  307.     <div align="right">
  308.       <?php endif;?>
  309.     </div>
  310.   </li>
  311.  <li></li>
  312.  <li></li>
  313. </ul>
  314.  <div align="right"></div>
  315. <div align="right"></div>

Sigo en uun comment