Codigo php no respeta una div

juancile · #1 (**permalink**) 13/05/2009, 17:01

Hola. Tengo una pagina en la que tengo un formulario en php en el que se puede ingresar un mensaje. La pagina esta hecha con divs.

Luego de enviar el mensaje se dirige a una pagina en la que se muestra los datos que ingreso. Pero el mensaje no respeta el ancho de la div, no salta al siguiente renglon cuando se termina el ancho de la div sino que sigue de largo quedando todo el mensaje en una sola linea y fuera del diseño.

El codigo para imprimir el mensaje es:

Código PHP:

<?php print $text; ?>

Que puedo hacer!!!. Gracias!.

David · #2 (**permalink**) 13/05/2009, 17:03

El problema no es de PHP. Sino más bien de (X)HTML/CSS, debes mostrar el código del div y el estilo que tiene para que podamos tener una idea de cuál puede ser el problema.

GatorV · #3 (**permalink**) 13/05/2009, 17:38

Tema trasladado desde PHP

juancile · #4 (**permalink**) 13/05/2009, 17:52

El codigo del div es:

Código:

<div id="cancion-centro2">
Mensaje: <?php print $text; ?>
</div>

El estilo es:

Código:

#cancion-centro2{
	width:705px;
	height:0 auto;
	float:left;
	padding:0 0 0 25px;
	margin:0 auto;
}

David · #5 (**permalink**) 13/05/2009, 19:53

Ese height: 0 auto está mal, y puede que sea el causante de los problemas. Debes especificar un alto correcto o en cualquier caso borrarlo.

Mikmoro · #6 (**permalink**) 14/05/2009, 05:14

Cita:

Iniciado por David el Grande

Ese height: 0 auto está mal, y puede que sea el causante de los problemas. Debes especificar un alto correcto o en cualquier caso borrarlo.

Sin duda: de hecho provocará que el resto de propiedades de ese selector no sean leídas, casi seguro.

juancile · #7 (**permalink**) 14/05/2009, 05:50

Hola amigos. La verdad no tengo mucha experiencia en css. Borre el higth como me dijeron, pero el problema sigue. Les muestro el codigo entero.

PHP:
[PHP<?php
$_headers .= "Content-type: text/html; charset=utf-8\r\n";

$headers = "From: $name";
$message .= "
Nombre: $name
E-mail: $email
Asunto: Escribinos

Mensaje:
$text
";
?>
<div id="cancion-centro2">
Hemos recibido tu mensaje. Nos encargaremos de responder tu consulta.
Los datos que ingresaste son los siguientes:
Tu nombre: <?php print $name; ?>.
Tu e-mail: <?php print $email; ?>.
Mensaje: <?php print $text; ?>.
<a href="index.php"><< volver</a>
</div>
<?php
$message = stripslashes($message);

$message = strip_tags ($message);

$sub = "Escribinos - Impacto 98.7";

// RECUERDAR CAMBIAR LA DIRECCION DE CORREO
ini_set("sendmail_from", "[email protected]");
mail("[email protected]", $sub, $message, $headers);

?>[/PHP]

CSS:

Código HTML:

#conteiner{
	width:0 auto;
	height:0 auto;
	margin:0px;
	padding:0px;
	margin-left: auto;
	margin-right: auto;
	background-image:url(imgs/fondo.png);
}
#centro-programacion{
	width:760px;
	height:62px;
	float:left;
	margin:0 auto;
}
#cancion-centro{
	width:760px;
	background-color:#fff;
	margin:0 auto;
	padding:0;
}
#cancion-centro2{
	width:705px;
	float:left;
	padding:0 0 0 25px;
	margin:0 auto;
	
}

Debe tener muchisimos errores, la verdad si no tienen ganas de perder mucho tiempo me conformo que me digan cual es el problema por el cual el mensaje php sigue de largo como si estuviera por ensima de las divs y hay que hacer scroll horizontal.
Gracias!.

David · #8 (**permalink**) 14/05/2009, 05:55

Tu selector #conteiner sigue teniendo estos:

Código css:

Ver originalwidth:0 auto;
    height:0 auto;

Lo cual, como te habíamos comentado, es incorrecto.

Además, en el código solo se ve un div, ¿los demás que están en la hoja de estilos también aparecen en la página?

P.S.: Es conveniente que muestres el HTML resultante en lugar del código PHP (ejecuta la página, ve a tu navegador en la opción "Ver Código Fuente")

kseso? · #9 (**permalink**) 14/05/2009, 05:57

Mira las propiedades "overflow" y "white-space".

juancile · #10 (**permalink**) 14/05/2009, 06:22

Este es el codigo completo de la pagina:

Código HTML:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Impacto 98.7</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

</head>
<body onload="MM_preloadImages('imgs/escucha2.jpg','imgs/sp2.jpg')" >

<div id="conteiner">

	<div id="header">
		<div class="texto" id="header-arriba">
        FM IMPACTO 98.7
</div>
		<div id="header-abajo">
        Escucha la radio</div>
  </div>
        
    <div id="cancion-centro">  
    <div id="centro-programacion">
    <img src="imgs/escribinos2.jpg" alt="Escribinos - FM Impacto 98.7" width="760" height="62" /></div> 
	
     <?php
	  $_headers .= "Content-type: text/html; charset=utf-8\r\n";
	  
	  $headers = "From: $name";
      $message .= "
      Nombre: $name
      E-mail: $email
      Asunto: Escribinos
	  
      Mensaje:
      $text
    ";
    ?>
    <div id="cancion-centro2">
    Hemos recibido tu mensaje. Nos encargaremos de responder tu consulta.
    Los datos que ingresaste son los siguientes:<p>
    <b>Tu nombre:</b> <?php print $name; ?>.<p>
    <b>Tu e-mail:</b> <?php print $email; ?>.<p>
    <b>Mensaje:</b> <?php print $text; ?>.<p>
    <span class="clase1"><a href="index.php">&lt;&lt; volver</a></span>   
    </div>
    <?php 
      $message = stripslashes($message);

      $message = strip_tags ($message);
	  
	  $sub = "Escribinos - Impacto 98.7";

      // RECUERDAR CAMBIAR LA DIRECCION DE CORREO
	  ini_set("sendmail_from", "[email protected]");
      mail("[email protected]", $sub, $message, $headers);

      ?>
       
	
    	<div id="pie">
    		<div class="texto2" id="pie1">
            FM Impacto 98.7 - Se escucha el cambio      
            </div>
            <br clear="all" />
    </div>
    
</div>
</body>
</html>

Ahi aparecen el resto de las divs que estan en el css. Probe con overflow y no quiero scroll, y creo que withe-space no es lo que necesito. No encuetro el problema...

kseso? · #11 (**permalink**) 14/05/2009, 06:26

con overflow aparece el scroll, si le fijas una altura, al sobrepasarla. Si no se la indicas, el contenedor crecerá en altura en función de su contenido.

Creo que lo que te pedía David es el html generado en el navegador cuando ha cargado la página.

juancile · #12 (**permalink**) 14/05/2009, 06:30

Le puse overflow:auto;
Igual la altura no es problema ya que el mensaje queda impreso en una sola linea, o sea, te imaginas un mensaje de 500 caracteres en una sola linea. Queda afuera del diseño.

Ingresa aca para que veas el problema y manda un mensaje bien largo.
sitiodepartida.com/impacto/index.php

David · #13 (**permalink**) 14/05/2009, 06:31

Para empezar, es conveniente que especifiques un DOCTYPE adecuado a tu documento.

Por otro lado, el div conteiner no tiene tag de cierre. También, debes hacer la corrección que te mencioné en tu hoja de estilos.

EDITO: En el enlace que pusiste, ¿cuál es el problema exactamente?

juancile · #14 (**permalink**) 14/05/2009, 06:54

Me di cuenta que el problema es cuando en el mensaje ingresar muchos caracteres sin espacios. Por ejemplo: aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa. Es ahi cuando sale fuera del diseño.

kseso? · #15 (**permalink**) 14/05/2009, 06:57

Hola David
No es en ese enlace, sino en la pantalla a la que te dirige una vez enviado el mensaje.
El problema de desbordamiento aparece si alguien ingresa una "palabra" de longitud mayor a 705px, cosa que en castellano no existe (con el font-size que tienes ahí)
Así que el problema no es tal, sólo será una situación que se le presente al "gracioso" que no le funcione la barra espaciadora.
Así que tiene dos opciones:
1ª: ser igual de gracioso poner overflow: hidden y que no lo vea completo el emisor o
2ª: colocar overflow:auto y que el gracioso tenga que desplazar el scroll para leerse a sí mismo.

Juancile, me permito sugerirte que cuides un poco mas la ortografía, lo correcto es "pide" y "escríbenos"

EDITO:

David · #16 (**permalink**) 14/05/2009, 07:02

En ese caso puedes usar la función wordwrap de PHP para cortar las palabras (http://www.php.net/wordwrap) u ocultar lo que sobrepasa el contenedor con la propiedad overflow.

P.S.: La propiedad word-wrap aún no está correctamente implementada en los navegadores (dicen que estará en el tan esperado CSS3)

EDITO: