Problema con popup en página: afecta a widget del formulario

  • Autor Autor Alcarver
  • Fecha de inicio Fecha de inicio

Alcarver

Gamma
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Hola, Betas!

He colocado un popup en una de mis páginas, pero tengo un problema, porque el background está afectando a uno de los widgets. La página en cuestión es:

Enlace eliminado

Verán que hay un popup que utiliza en parte el fondo #FFF295. Lo malo es que sobre el widget del formulario en el sidebar (el que empieza con "GRATIS"), tiene una pequeña partecita del mismo color, que ha aparecido desde que puse el popup.

Mi teoría es que dejé algo abierto en el código del popup, pero no tengo ni idea de cómo repararlo (html no es mi fuerte).

El código del popup es:

Insertar CODE, HTML o PHP:
<center><img src="http://mesientoguapa.com/wp-content/uploads/banner-optin.jpg" border="0"><div style="border: 3px dashed [B]Enlace eliminado[/B]padding:15px;background-color:[B]Enlace eliminado[/B]"><div class="o-form"><div class="o-form-header"><h2 id="o-form-title">Suscripción Gratuita a la Newsletter de MeSientoGuapa.com</h2><p id="o-form-description">Dietas, cómo adelgazar, salud, moda, noticias y más  </p></div><form accept-charset="UTF-8" method="post" action="http://www.imnicamail.com/v4/subscribe.php"><div class="o-form-row"><label for="FormValue_EmailAddress">Tu Email:</label><input id="FormValue_EmailAddress" name="FormValue_Fields[EmailAddress]" value="" type="text" style="width:254px; height:20px;"></div><input id="FormButton_Subscribe" name="FormButton_Subscribe" value="Suscríbete" type="submit"><input name="FormValue_ListID" value="3011" type="hidden"><input id="FormValue_Command" name="FormValue_Command" value="Subscriber.Add" type="hidden"></form> * Utiliza tu <b>EMAIL PRINCIPAL</b> para asegurar que recibes <b>gratis</b> nuestra newsletter<style type="text/css" media="screen">.o-form{background-color:[B]Enlace eliminado[/B]border:1px solid [B]Enlace eliminado[/B]}
.o-form form{margin:0px;padding:0px;}
.o-form .o-form-header{background-color:[B]Enlace eliminado[/B]padding:9px;}
.o-form h2{font-family:Arial,sans-serif;font-size:18px;line-height:27px;margin:0px;padding:0px;}
.o-form p{font-family:Arial,sans-serif;font-size:12px;line-height:18px;margin:0px;padding:0px;}
.o-form .o-form-row{margin-top:9px;padding:0 9px;}
.o-form .o-form-row label{font-family:Arial,sans-serif;font-size:12px;display:block;font-weight:bold;}
.o-form input[type="submit"]{margin:20px 9px 18px 9px;}
</style></div></div></center>

Y el del widget:

Insertar CODE, HTML o PHP:
<img src="http://mesientoguapa.com/wp-content/uploads/190Sidebar2.jpg"
align="right" border="0"></a>
<p>
<center><div class="o-form"><h2 id="o-form-title"></h2><p id="o-form-description"></p></div><form action="http://www.imnicamail.com/v4/subscribe.php" method="post" accept-charset="UTF-8"><div class="o-form-row"><label for="FormValue_EmailAddress"><b>Tu Correo Electrónico:</b><br></label><input type="text" name="FormValue_Fields[EmailAddress]" value="" id="FormValue_EmailAddress"></div><p>

<table border="0" cellspacing="0" cellpadding="4">
<tr>
<td nowrap style="background:red" onMouseDown="this.style.backgroundColor='#FF0000'" onMouseOver="this.style.backgroundColor='#009900'" onMouseOut="this.style.backgroundColor='#FF0000'">
<input name="FormButton_Subscribe" type="submit" id="FormButton_Subscribe" style="color:#000000;cursor:pointer;cursor:hand;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 14px;" value='Acceso Inmediato >>'/>
</td>
</tr>
</table>

<input type="hidden" name="FormValue_ListID" value="3011"><input type="hidden" name="FormValue_Command" value="Subscriber.Add" id="FormValue_Command"></form><style type="text/css" media="screen">.o-form{background-color:#fff;border:1px solid [B]Enlace eliminado[/B]}
.o-form form{margin:0px;padding:0px;}
.o-form .o-form-header{background-color:[B]Enlace eliminado[/B]padding:9px;}
.o-form h2{font-family:Arial,sans-serif;font-size:18px;line-height:27px;margin:0px;padding:0px;}
.o-form p{font-family:Arial,sans-serif;font-size:12px;line-height:18px;margin:0px;padding:0px;}
.o-form .o-form-row{margin-top:9px;padding:0 9px;}
.o-form .o-form-row label{font-family:Arial,sans-serif;font-size:12px;display:block;font-weight:bold;}
.o-form input[type="submit"]{margin:20px 9px 18px 9px;}
</style></center>

He intentado agregando un </div> al principio del widget, un </style> e incluso un </all>
(hasta que me di cuenta de que no existe, 😛). Como dije, el html no es mi fuerte.

¿Alguien puede ayudarme a ver qué es lo que falla para poder solucionarlo pronto?

Gracias!
 
Última edición:
Hola Alcarver,

Te sobra el siguiente codigo, eliminalo y te desaparecerá ese error:
<div class="o-form"><h2 id="o-form-title"></h2><p id="o-form-description"></p></div>

Si lo necesitas, por que haces referencia a el en otro sitio, bastaria con cambiar el css:

.o-form {
background-color: Enlace eliminado
border: 1px solid Enlace eliminado
}
a
.o-form {
background-color: Enlace eliminado
border: 0px;
}

Un saludo
 
Revise el código, y me parece correcto lo que dice ivanotes.
 
Gracias!

Lo voy a probar y les cuento! 🙂

- - - Actualizado - - -

PERFECTOOO! Ya está solucionado!

Muchísimas gracias, chicos!!!!! :encouragement: