Foros del Web » Creando para Internet » Diseño web »

Div que sale del body

 Estas en el tema de Div que sale del body en el foro de Diseño web en Foros del Web. Hola, estoy desarrollando una web en donde creo contenido automáticamente dependiendo del usuario que entra, voy poniendo el contenido dentro de un div y lo ...
  #1 (permalink)  
Antiguo 18/03/2013, 23:29
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Div que sale del body
Hola, estoy desarrollando una web en donde creo contenido automáticamente dependiendo del usuario que entra, voy poniendo el contenido dentro de un div y lo hago con javascript, la cosa es que el div sale del body, esta mejor explicado en la imagen de aquí:

http://www.subirimagenes.net/i/1303190635462929.jpg

es la vista 3D del firefox, lo unico q hago es que cree el div que contiene una lista, y con javascript voy agregando li's, alguien sabe como podría corregir esto o porque pasa??
  #2 (permalink)  
Antiguo 18/03/2013, 23:32
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 16 años, 10 meses
Puntos: 181
Respuesta: Div que sale del body
Hola,

Necesitas poner el código que estas usando o mejor aun la URL donde tienes la web.




Saludos
__________________
------------- " La felicidad no llega de afuera, nace desde dentro. " -------------
  #3 (permalink)  
Antiguo 19/03/2013, 00:15
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
a ok, el codigo es un archivo php donde al inicio cargo los comentarios

Código PHP: 
Ver original
  1. <?php
  2.  
  3.         include("solicitudes.php");
  4.                 echo "<div id='cuerpo'>";
  5.         echo "<br><br>";
  6.         echo "<form action=# method='GET' onsubmit='return enviarComparti()'>";
  7.         echo "<span id='compartirT'>".$personalizado."</span>";
  8.         echo "<input type='text' name='cosa' placeholder='&iquest;A d&oacute;nde quieres ir?' id='compartirH'>";
  9.         echo "<br><br>";
  10.         echo "<input type='submit' id='enviarCompartir' value='Compartir'>";
  11.         echo "</form>";
  12.         echo "<br><br><br><br>";
  13.  
  14.         echo    "<ul class='ulnotice'>";
  15.             echo "<span id='more'>mas</span>";
  16.         
  17.             while($aho = $todo -> fetch_assoc()){
  18. echo "<li class='notificacion'><a href='perfil.php?uID=".$aho['user']."'><img id='pubIMG' src='usuarios/".$aho['user']."/".$aho['avatar']."'><span id='pubNom'><b>".$aho['nombre']."</b></span></a><br><br><span id='pubMsj'>".$aho['mensaje']." ".$aho['lugar']."</span></li>";
  19.             $b=1;
  20.             $lastID[] = $aho['ID'];
  21.             }
  22.  
  23.             
  24.  
  25.         echo "</ul>";
  26.  
  27.                 echo "</div>";


y después con javascript cargo los nuevos:

Código Javascript: 
Ver original
  1. function mensajesNuevos(){
  2.  
  3.     var idi = $("#lastID").val();
  4.  
  5.     $.getJSON("checkmensajes.php",{id:idi},function(respuesta){
  6.  
  7.         if(respuesta != 0){
  8.             var len = respuesta.length;
  9.             $("#more").css("display","inline");
  10.             $("#more").text("mas ("+len+")");
  11.             $("#more").unbind("click");
  12.             $("#more").click(function(e){
  13.  
  14.                 for(var i=0; i<len; i++){
  15.  
  16.                     $("#more").css("display","none");
  17.                     $("#more").after("<li class='notificacion'><a href='perfil.php?uID="+respuesta[i].usu+"'><img src='usuarios/"+respuesta[i].usu+"/"+respuesta[i].foto+"' id='pubIMG'><span id='pubNom'><b>"+respuesta[i].nombre+"</b></span></a><br><br><br><span>"+respuesta[i].mensaje+" "+respuesta[i].acontesimiento+"</span></li>");
  18.                     $("#lastID").val(respuesta[0].ID);
  19.                 }
  20.                 
  21.                 e.stopPropagation ( );
  22.             });
  23.         }
  24.     });
  25. }

un colega me comento que debía de aumentar el tamaño del body con forme se agregan comentarios pero no estaba seguro si era lo correcto ni como hacerlo, espero que puedan ayudarme
  #4 (permalink)  
Antiguo 21/03/2013, 07:07
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Div que sale del body
Lo que necesitamos ver es el código HTML para ver la estructura y el código CSS para ver el diseño/estilos. Como cargues los datos da igual, así que el código JavaScript y sobre todo de PHP es lo de menos. Así pues trata de pegar sólo el HTML —el que sale en el navegador, no el de tu archivo .php— y CSS. También valdría con poner la URL de donde tengas la página como apunta pitufoweb.

Cita:
Iniciado por MCF Ver Mensaje
un colega me comento que debía de aumentar el tamaño del body con forme se agregan comentarios pero no estaba seguro si era lo correcto ni como hacerlo
Deja de ser colega de esa persona. Dado que todos los elementos tienen por defecto una altura automática, se suelen adaptar al contenido. Así que es mejor arreglar el problema de raíz que crear apaños como ese para ir escapando.

Supongo, sin ver código, que se deberá a algún problema con el flotado o posiciones absolutas y/o fijas.
  #5 (permalink)  
Antiguo 21/03/2013, 12:52
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
jajajaja creo q seguire tu consejo jaja

muy bien el html es:

Código HTML: 
Ver original
  1. <html>
  2. <head>
  3.     <title>Crowte</title>
  4.     <link rel="stylesheet" type="text/css" href="estilos.css">
  5.     <script type="text/javascript" src="jquery.js"></script>
  6.     <script type="text/javascript" src="carga.js"></script>
  7.     <script type="text/javascript" src="m.js"></script>
  8.     <script type="text/javascript" src="buscar.js"></script>
  9.     <meta http-equiv="Content-type" content="text/php; charset=utf-8">
  10. </head>
  11. <body>
  12. <div id="menuSup"><a href="http://www.tequilanoire.p.ht/prueba"><img  id="logo" src="imagenes/logo.png"></a><input type="text" id="buscador" placeholder="&iquest;Qu&eacute; plan?"><a href='deSeS.php'><span id='scsn'>Cerrar sesi&oacute;n</span></a><img src='imagenes/happytreefacealpha.png' id='cara'><span id='numNotif'></span><span id='novedadSpn' class='rojo'>1</span><span><a href='cambiar_perfil.php'><img src='imagenes/editarIMG.png' id='editarIMG'></a></span><img src='imagenes/llave.png' id='llv'><span id='tooltipEP'>Editar perfil</span><span id='tooltipP'>Preferencias</span></div><div id="sre"></div>
  13. <span id="spn" style="position: fixed">dsa</span>
  14. <div id='cuerpo'><br><br><form action=# method='GET' onsubmit='return enviarComparti()'><span id='compartirT'>1 ... </span><input type='text' name='cosa' placeholder='&iquest;A d&oacute;nde quieres ir?' id='compartirH'><br><br><input type='submit' id='enviarCompartir' value='Compartir'></form><br><br><br><br><ul class='ulnotice'><span id='more'>mas</span><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  ;)</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  ;)</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  q onda jony claro aqui ando !</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  q onda jony claro aqui ando !</span></li><li class='notificacion'><a href='perfil.php?uID=27'><img id='pubIMG' src='usuarios/27/duro370x415300x350.jpg'><span id='pubNom'><b>Antulio Jonathan Arturo</b></span></a><br><br><span id='pubMsj'>En camino a hola paco estas ahi</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  miiii</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  miiii</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  de </span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  de </span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  s</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  s</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  s</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  s</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  ss</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  ss</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  dudas</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  dudas</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  las chelas !!</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  las chelas !!</span></li><li class='notificacion'><a href='perfil.php?uID=17'><img id='pubIMG' src='usuarios/17/c.jpg'><span id='pubNom'><b>paco</b></span></a><br><br><span id='pubMsj'>1 ...  s</span></li><input type='hidden' id='lastID' value='147'></ul></div>
  15. </body>
  16. </html>
  #6 (permalink)  
Antiguo 21/03/2013, 12:53
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
y el css:

Código CSS: 
Ver original
  1. a{
  2.  
  3.     color: rgb(0,170,210);
  4.     text-decoration: none;
  5. }
  6.  
  7. a:hover{
  8.  
  9.     text-decoration: underline;
  10. }
  11.  
  12. a:visited{
  13.  
  14.     color: rgb(0,170,210);
  15.     text-decoration: none;
  16. }
  17.  
  18. a:active{
  19.  
  20.     color: rgb(0,170,210);
  21.     text-decoration: none;
  22. }
  23.  
  24. a.aGray{
  25.  
  26.     color: gray;
  27. }
  28.  
  29. body, html{
  30.  
  31.     height: 100%;
  32.     width: 99%;
  33. }
  34.  
  35. body{
  36.  
  37.     background-color: rgba(139,89,62,0.2);
  38.     color: gray;
  39.     font-family: verdana;
  40. }
  41.  
  42. ul{
  43.  
  44.     list-style-type: none;
  45. }
  46.  
  47. li.busqueda:hover{
  48.  
  49.     background-color: rgba(0,170,170,0.5);
  50.     color: white;
  51.     cursor: pointer;
  52. }
  53.  
  54. .capaLogo{
  55.  
  56.     background: -moz-linear-gradient(top, rgb(255,255,255), rgb(200,200,200));
  57.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255,255,255)), to(rgb(200,200,200)));
  58.     border: 1px solid rgb(200,200,200);
  59.     border-radius: 5px;
  60.     padding: 10px;
  61.     width: 50px;
  62. }
  63.  
  64. .dv{
  65.  
  66.     border: 1px solid rgb(230,230,230);
  67.     width: 90%;
  68. }
  69.  
  70. .enum{
  71.  
  72.     color: white;
  73.     background: -moz-linear-gradient(top, rgb(0,170,210), rgb(0,140,180));
  74.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,170,210)), to(rgb(0,140,180)));
  75.     border-radius: 5px;
  76.     padding: 10px;
  77. }
  78.  
  79. .friends_logo{
  80.  
  81.     height: 50px;
  82.     width: 50px;
  83. }
  84.  
  85. .lisearch{
  86.  
  87.     left: -9.3%;
  88.     padding: 20px;
  89.     width: 100%;
  90. }
  91.  
  92. .lisearch:hover{
  93.  
  94.     background: -moz-linear-gradient(top, rgb(0,170,210), rgb(0,140,180));
  95.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,170,210)), to(rgb(0,140,180))); 
  96.     color: white;
  97.     text-decoration: none;
  98. }
  99.  
  100. .negro{
  101.  
  102.     background: rgba(0,0,0,0.4);
  103.     display: none;
  104.     left: 29%;
  105.     top: -20%;
  106. }
  107.  
  108. .notificacion{
  109.  
  110.     /*background: red;*/
  111.     border-bottom: 1px solid rgb(220,220,220);
  112.     padding: 5%;
  113. }
  114.  
  115. .ulnotice{
  116.  
  117.     left: -5%;
  118. }
  119.  
  120. .medio{
  121.  
  122.     background-color: rgba(0,0,0,0.4);
  123.     display: inline;
  124.     left: 28%;
  125.     top: -20%;
  126.     z-index: 3;
  127. }
  128.  
  129. .rojo{
  130.  
  131.     background-color: rgba(250,0,0,0.8);
  132.     display: inline;
  133.     left: 28%;
  134.     top: -20%;
  135.     z-index: 3;
  136. }
  137.  
  138. #blockaddRS, #blockRS, #blockSRC{
  139.  
  140.     font-size: 14px;
  141. }
  142.  
  143. #blockaddRS{
  144.  
  145.     top: 15%;
  146. }
  147.  
  148. #blockSRC{
  149.  
  150.     top: 45%;
  151. }
  152.  
  153. #buscador{
  154.  
  155.     background-image: url(imagenes/lupa3.png);
  156.     background-size: 25px 25px;
  157.     background-repeat: no-repeat;
  158.     background-position: 15px 13px;
  159.     border: 2px solid rgb(0,150,150);
  160.     font-size:100%; 
  161.     padding-left: 50px;
  162.     left:29%;
  163.     text-transform: 40px;
  164.     top:-15%; 
  165.     height: 80%; 
  166.     width:20%;
  167. }
  168.  
  169. #cara{
  170.  
  171.     left: 29%;
  172.     top: 15%;
  173.     height:30px;
  174.     padding: 3px;
  175.     width:30px; 
  176. }
  177.  
  178. #cara:hover{
  179.  
  180.     opacity: 0.7;
  181.     filter:alpha(opacity=70);
  182. }
  183.  
  184. #compartirH{
  185.  
  186.     /*border: 1px solid rgb(200,200,200);
  187.     border-radius: 10px;
  188.     font-size: 100%;
  189.     width: 60%;
  190.     height: 30%;*/
  191.     left: 41.5%;
  192. }
  193.  
  194. #compartirT{
  195.  
  196.     left: 41%;
  197. }
  198.  
  199. #contrasenaA{
  200.  
  201.     top: 30px;
  202. }
  203.  
  204. #contrasenaB{
  205.  
  206.     top: 77px;
  207.     left: 25px;
  208. }
  209.  
  210.  
  211. .friends_logo, .lisearch, .ulnotice, #blockaddRS, #blockSRC, #bloqMenu, #buscador, #cara, #compartirH, #compartirT, #correoB, #contrasenaB, #cuaInSes, #cuerpo, #dv1, #editarIMG, #enviarCompartir, #evpLogo, #fbLogo, #usuarioB, #contrasenaA, #InSes, #RegSt, #llv, #logo, #menuSup, #more, #novedadSpn, #obs, #oc, #pubNom, #redes, #scsn, #tLogo, #tooltipEP, #tooltipP, #txtIn, #txtReg{
  212.  
  213.     position: relative;
  214. }
  215.  
  216. #correoB{
  217.  
  218.     top: 50px;
  219.     left: -140px;
  220. }
  221.  
  222. #cuaInSes, #cuerpo{
  223.  
  224.     background-color: rgb(255,255,255);
  225.     border: 1px solid rgb(200,200,200);
  226.     border-radius: 15px;
  227.     box-shadow: 0px 0px 2px 0px rgba(139,89,62,0.3);
  228. }
  229.  
  230. #cuaInSes{
  231.  
  232.     left: 32.5%;
  233.     padding: 60px;
  234.     padding-bottom: 10%;
  235.     top: 100px;
  236.     width: 30%;
  237. }
  238.  
  239.  
  240. #cuerpo{
  241.  
  242.     left: 20%;
  243.     padding: 10px;
  244.     padding-left: 50px;
  245.     /*padding-bottom: 38%;*/
  246.     top: 4%;
  247.     /*height: 40%;*/
  248.     width: 60%;
  249. }
  250.  
  251. #dv1{
  252.  
  253.     top: 30%;
  254. }
  255.  
  256. #editarIMG{
  257.  
  258.     display: none;
  259.     top: -15%;
  260.     left: 29.5%;
  261.     height: 15px;
  262.     width: 15px;
  263. }
  264.  
  265. #enviarCompartir{
  266.  
  267.     left: 45%;
  268.     background: -moz-linear-gradient(top, rgb(0,170,210), rgb(0,140,180));
  269.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,170,210)), to(rgb(0,140,180)));
  270.     border: 1px solid rgb(0,120,160);
  271.     border-radius: 15px;
  272.     color: white;
  273.     padding: 1.5%;
  274. }
  275.  
  276. #enviarCompartir:hover{
  277.  
  278.     background: -moz-linear-gradient(top, rgb(0,210,250), rgb(0,180,220));
  279.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,210,250)), to(rgb(0,180,220))); 
  280. }
  281.  
  282. #evpLogo{
  283.  
  284.     top: 55%;
  285. }
  286.  
  287. #fbLogo, #tLogo{
  288.  
  289.     display: inline-block;
  290. }
  291.  
  292. #fbLogo{
  293.  
  294.     top: 20%;
  295. }
  296.  
  297. #InSes{
  298.  
  299.     left: 25%;
  300.     top: 50px;
  301. }
  302.  
  303. #llv{
  304.  
  305.     display: none;
  306.     top: -15%;
  307.     left: 30%;
  308.     height: 15px;
  309.     width: 15px;
  310. }
  311.  
  312. #logo{
  313.  
  314.     left: 5%;
  315.     top: 20%;
  316. }
  317.  
  318. #menuSup{
  319.     
  320.     background: -moz-linear-gradient(top, rgb(0,190,190), rgb(0,170,170));
  321.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,190,190)), to(rgb(0,170,170)));
  322.     left:-10px; 
  323.     top:-10px; 
  324.     width: 102.3%; 
  325.     height: 64px; 
  326.     z-index: 1;
  327. }
  328.  
  329. #more{
  330.  
  331.     background-color: gray;
  332.     color: white;
  333.     display: none;
  334.     left: 40%;
  335.     padding: 1%;
  336.     padding-left: 10%;
  337.     padding-right: 10%;
  338. }
  339.  
  340. #more:hover{
  341.  
  342.     background-color: rgb(150,150,150);
  343. }
  344.  
  345. #novedadSpn{
  346.  
  347.     border-radius: 5px;
  348.     color: rgb(255,255,255);
  349.     font-size: 10px;
  350.     padding: 3px;
  351. }
  352.  
  353. #obs{
  354.  
  355.     background: rgba(0,0,0,0.3);
  356.     border-radius: 15px;
  357.     height: 28px;
  358.     left: 72.999%;
  359.     top: -8%;
  360.     width: 28px;
  361.     z-index: 20;
  362. }
  363.  
  364. #oc, #scsn{
  365.  
  366.     font-size: 13px;
  367. }
  368.  
  369. #oc{
  370.  
  371.     color: rgb(0,170,210);
  372.     top: 100px;
  373.     left: 50%;
  374. }
  375.  
  376. #blockaddRS, #blockRS, #scsn{
  377.  
  378.     padding: 5px;
  379. }
  380.  
  381. #pubIMG{
  382.  
  383.     max-width: 50px;
  384.     max-height: 50px;
  385. }
  386.  
  387. #pubNom{
  388.  
  389.     left: 3%;
  390. }
  391.  
  392. #scsn{
  393.  
  394.     color: white;
  395.     background: -moz-linear-gradient(top, rgb(0,190,190), rgb(0,170,170));
  396.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,190,190)), to(rgb(0,170,170)));
  397.     border: 1px solid rgb(0,150,150);
  398.     border-radius: 5px;
  399.     left: 46%;
  400. }
  401.  
  402. #sre{
  403.     background-color: white;
  404.     border: 2px solid rgb(0,170,170);
  405.     border-top: 0;
  406.     display: none;
  407.     left: 37.5%;
  408.     top: 8.6%;
  409.     position: absolute;
  410.     width: 33%;
  411.     z-index: 100000;
  412. }
  413.  
  414. #cara, #editarIMG, #evpLogo, #fbLogo, #llv, #more, #novedadSpn, #tLogo, #txtIn, #txtReg, #scsn{ 
  415.  
  416.     cursor: pointer;
  417. }
  418.  
  419. #tooltipEP{
  420.  
  421.     background: rgba(0,0,0,0.5);
  422.     border-radius: 5px;
  423.     display: none;
  424.     padding: 5px;
  425.     font-size: 10px;
  426.     left: 26%;
  427.     top: 15%;
  428. }
  429.  
  430. #tooltipP{
  431.  
  432.     background: rgba(0,0,0,0.5);
  433.     border-radius: 5px;
  434.     display: none;
  435.     padding: 5px;
  436.     font-size: 10px;
  437.     left: 27%;
  438.     top: 15%;
  439. }
  440.  
  441. #tLogo{
  442.  
  443.     left: 15%;
  444.     top: 13.125%;
  445. }
  446.  
  447. #txtIn{
  448.  
  449.     color: rgb(255,255,255);
  450.     border-radius: 10px;
  451.     padding: 10px;
  452. }
  453.  
  454. #txtIn{
  455.  
  456.     background: -moz-linear-gradient(top, rgb(0,170,210), rgb(0,140,180));
  457.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,170,210)), to(rgb(0,140,180)));
  458.     left: 30%;
  459. }
  460.  
  461. #txtIn:hover{
  462.  
  463.     background: -moz-linear-gradient(top, rgb(0,210,250), rgb(0,180,220));
  464.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0,210,250)), to(rgb(0,180,220)));
  465. }
  466.  
  467. #txtReg{
  468.  
  469.     left: 160px;
  470. }
  471.  
  472. #redes{
  473.  
  474.     top: 20%;
  475. }
  476.  
  477. #RegSt{
  478.  
  479.     left: 50px;
  480.     top: 50px;
  481. }
  482.  
  483. #usuarioB{
  484.  
  485.     left: 50px;
  486. }

la direccion es:

http://www.tequilanoire.p.ht/prueba/
  #7 (permalink)  
Antiguo 21/03/2013, 12:54
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
si sirve de ayuda la capa que sale del div es la de cuerpo
  #8 (permalink)  
Antiguo 21/03/2013, 12:57
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
  
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 8 meses
Puntos: 1329
Respuesta: Div que sale del body
Damn, cuándo escribas HTML identalo, es difícil leer eso.
__________________
Grupo Telegram Docker en Español
  #9 (permalink)  
Antiguo 21/03/2013, 14:54
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
cierto lo siento, aqui esta otra vez, le quite lo que genera con javascript, ya que solo se va agregando a las etiquetas ul,

Código HTML: 
Ver original
  1. <html>
  2. <head>
  3.     <title>Crowte</title>
  4.     <link rel="stylesheet" type="text/css" href="estilos.css">
  5.     <script type="text/javascript" src="jquery.js"></script>
  6.     <script type="text/javascript" src="carga.js"></script>
  7.     <script type="text/javascript" src="m.js"></script>
  8.     <script type="text/javascript" src="buscar.js"></script>
  9.     <meta http-equiv="Content-type" content="text/php; charset=utf-8">
  10. </head>
  11. <body>
  12.      <div id="menuSup"><a href="http://www.tequilanoire.p.ht/prueba"><img  id="logo" src="imagenes/logo.png"></a><input              type="text" id="buscador" placeholder="&iquest;Qu&eacute; plan?"><a href='deSeS.php'>
  13.      <span id='scsn'>Cerrar sesi&oacute;n</span></a><img src='imagenes/happytreefacealpha.png' id='cara'>
  14.  
  15.      <span id='numNotif'></span><span id='novedadSpn' class='rojo'>1</span><span><a href='cambiar_perfil.php'><img src='imagenes/editarIMG.png'   id='editarIMG'></a></span><img src='imagenes/llave.png' id='llv'><span id='tooltipEP'>Editar perfil</span>
  16.  
  17.      <span  id='tooltipP'>Preferencias</span></div><div id="sre"></div>
  18.      <span id="spn" style="position: fixed">dsa</span>
  19.     
  20.  
  21.  
  22.  
  23. <!-- esta es la capa q se extiende fuera del body -->
  24.  
  25.      <div id='cuerpo'><br><br><form action=# method='GET' onsubmit='return enviarComparti()'>
  26.            <span id='compartirT'>1 ... </span><input type='text' name='cosa' placeholder='&iquest;A d&oacute;nde quieres ir?'   id='compartirH'><br><br>
  27.            <input type='submit' id='enviarCompartir' value='Compartir'></form><br><br><br><br>
  28.  
  29.  
  30.            <!-- aqui se agrega todo con el javascript -->
  31.  
  32.            <ul class='ulnotice'><span   id='more'>mas</span>
  33.            <input type='hidden' id='lastID' value='147'></ul>
  34.  
  35.        </div>
  36.  
  37.  
  38. </body>
  39. </html>
  #10 (permalink)  
Antiguo 21/03/2013, 16:12
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Div que sale del body
Veo que en la URL no es el código que pones aquí. ¿Cual es el elemento que se supone que sale de body?

Tu código es bastante proclive a dar fallos, tienes una cierta obsesión compulsiva por usar elementos posicionados relativamente, muchos márgenes negativos, ensaladas de pixeles y porcentajes...

La linea #211 del CSS es en plan "y aquí estoy yo".
  #11 (permalink)  
Antiguo 21/03/2013, 17:02
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
como q no es el codigo? si es el codigo solo que quite algunas cosas que no estan relacionadas con la capa para que se entendiera mejor el código, el q sale del body es la capa cuerpo, porque dices que es proclive a dar fallos? por posicionar los elementos relativamente, los márgenes negativos y todo eso ??
  #12 (permalink)  
Antiguo 21/03/2013, 17:06
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
  
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 8 meses
Puntos: 1329
Respuesta: Div que sale del body
Yo veo una página de login (y no me pienso registrar en un sitio nada más por eso).

Saludos
__________________
Grupo Telegram Docker en Español
  #13 (permalink)  
Antiguo 21/03/2013, 17:35
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Div que sale del body
Cita:
Iniciado por MCF Ver Mensaje
como q no es el codigo? si es el codigo solo que quite algunas cosas que no estan relacionadas con la capa para que se entendiera mejor el código, el q sale del body es la capa cuerpo
Aquí el HTML de la URL:

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html>
  3.     
  4.     <head>
  5.         <title>Crowte</title>
  6.         <link rel="stylesheet" type="text/css" href="estilos.css">
  7.         <script type="text/javascript" src="jquery.js"></script>
  8.         <script type="text/javascript" src="carga.js"></script>
  9.         <script type="text/javascript" src="m.js"></script>
  10.         <script type="text/javascript" src="buscar.js"></script>
  11.         <meta http-equiv="Content-type" content="text/php; charset=utf-8">
  12.     </head>
  13.     
  14.     <body>
  15.         <div id="menuSup">
  16.             <a href="http://www.tequilanoire.p.ht/prueba">
  17.                 <img id="logo" src="imagenes/logo.png">
  18.             </a>
  19.             <input type="text" id="buscador" placeholder="&iquest;Qu&eacute; plan?">
  20.         </div>
  21.         <div id="sre"></div>
  22. <span id="spn" style="position: fixed">dsa</span>
  23.  
  24.         <div id='cuaInSes'>
  25.             <span id='txtIn'>Inicia sesi&oacute;n</span>
  26.             <span id='txtReg'><a href='registro.php' class='aGray'>O reg&iacute;strate</a></span>
  27.             <form id='InSes' action='ckis.php' method='GET'><span id='correoA'><span id='correo'><b>Correo</b></span>
  28.                 <input name='usuario' type='text'>
  29.                 </span>
  30.                 <br><span id='contrasenaA'><span id='contrasena'><b>Contrase&ntilde;a</b></span>
  31.                 <input name='contra' type='password'>
  32.                 </span>
  33.                 <input type='hidden' name='ocult'>
  34.             </form>
  35.             <span id='oc'><a href='cambiar_contrasena.php'>&iquest;Olvidaste tu contrase&ntilde;a?</a></span>
  36.         </div>
  37.     </body>
  38.  
  39. </html>

Si ahí hay un elemento con id o clase "cuerpo" te regalamos un poni.

El código en general en sumamente complejo para una vista tan simple —suponiendo que la vista sea parecida a la URL. A mayor complejidad, mayores posibilidades de que algo salga mal.

Podrías revisar los tutoriales de http://librosweb.es.
  #14 (permalink)  
Antiguo 21/03/2013, 20:08
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
bueno claro q tienes q registrarte para que se muestre el código que yo puse, olvide decir eso, pero es de la misma pagina.

Pero como podría hacerlo más simple? te refieres al css??
  #15 (permalink)  
Antiguo 26/03/2013, 18:34
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Div que sale del body
MCF, da un usuario de prueba, algo como:
[email protected] - contraseña: 123456
Así podemos entrar y ver.

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #16 (permalink)  
Antiguo 31/03/2013, 20:03
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
perdón por la tardanza pero salí de la ciudad y acabo de regresar, cree el usuario de prueba el correo es [email protected] y la contraseña es 123456, he agregado algunas cosas pero el div que esta ocasionando los problemas sigue igual
  #17 (permalink)  
Antiguo 01/04/2013, 22:17
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Div que sale del body
¿Y cual era el problema?
Sé que parece una broma, pero no veo cual es el problema.
Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #18 (permalink)  
Antiguo 02/04/2013, 04:22
MCF
 
Fecha de Ingreso: marzo-2008
Mensajes: 126
Antigüedad: 16 años, 8 meses
Puntos: 4
Respuesta: Div que sale del body
Pues el problema inicial era que quería mandar a llamar una función cuando el scroll estuviera en la parte inferior de la página, cheque en páginas como facebook en donde ellos agregan mas contenido cuando llega hasta abajo el scroll, al salir del div y con los tutoriales que vi en la web no me salía, ahora ya lo logré experimentando un poco pero aun me llama la atención ya que páginas como facebook o aquí mismo no pasa eso y no logro dar porque a mi si me pasa.

No lo veo como broma ;) pero también si creen que ya es mucha exageración mía el querer saber exactamente el porque podemos dejar el tema hasta aquí, aunque creo q si se logra solucionar alguien que tenga el mismo problema -y que quizá afecte mucho mas a su página- podría encontrar solución aquí.

Etiquetas: body, fuera
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 04:48.