La pagina web no se me ve bien..
Quiero preguntarte por que razón una pagina web que tengo de desarrollada en Dreamweaver CS5 no se me ve bien cuando la deseo visualizar en internet explorer o en Mozilla firefox, en algunas paginas me dicen el algunos sitios web que debo de poner, la resolución por código:
<script>
top.resizeTo(800,600);
</script>
Pero a pesar de eso siempre la pagina se me ve distorsionada en cualquier explorador..
1 Respuesta
Se tendría que ver el código (o la pagina web) para poder hacer pruebas de código y ver donde podría estar el fallo, pero seguramente sea algún tipo de código.
¿Tienes algo donde poder ver la web?
Hola púes este es el código que tengo,,,incluso desde ayer me empezo a fallar lo de validación de campos vacíos en Javascript sin saber por que , aunque el código es extenso ahí te lo paso:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Nutriser</title>
<SCRIPT TYPE ="Text/Javascript">
function checkFields2() {
missinginfo = "";
var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
var str2 = removeSpaces(document.getElementById('txtInput').value);
if (str1 == str2) return true;
alert("No coinciden los caracteres de los textos ");
document.form1.Nombre5.value = "";
document.form1.Apellido5.value = "";
document.form1.Mensaje5.value = "";
document.form1.Validatexto.value = "";
document.form1.radio[0].checked = "";
document.form1.radio[1].checked = "";
if (document.form1.Nombre5.value == "") {
missinginfo += "\n - Nombre ";
}
if (document.form1.Apellido5.value == "") {
missinginfo += "\n - Apellido ";
}
if (document.form1.Email5.value.indexOf("@") == -1 || document.form1.Email5.value.indexOf(".") == -1 || document.form1.Email5.value == "") {
missinginfo += "\n - Ingrese E-Mail correcto o el campo E-Mail no se puede dejar vacio";
}
if (document.form1.Paisciudad5.value == "") {
missinginfo += "\n - Pais_Ciudad";
}
if (document.form1.Mensaje5.value == "") {
missinginfo += "\n - Mensaje";
}
if (document.form1.Validatexto.value == "") {
missinginfo += "\n - Código de seguridad";
}
if (document.form1.radio[0].checked == "" && document.form1.radio[1].checked == "") {
missinginfo += "\n - Debes seleccionar Si o No ";
}
if (missinginfo != "") {
missinginfo ="_____________________________\n" +
"Debe rellenar los campos:\n" +
missinginfo + "\n_____________________________" +
"\nPor favor inténtelo de nuevo";
alert(missinginfo);
return false;
}
else return true;
}
</script>
<style type="text/css">
.letra-inicial {font-size: 38px;
color: #FF8000;
font-weight: bold;
}
.titulos {font-size: 20px;
}
.ew21 {
}
#apDiv1 {
position:absolute;
width:200px;
height:210px;
z-index:5;
left: 30px;
top: 465px;
}
#apDiv2 {
position:absolute;
width:200px;
height:27px;
z-index:6;
left: 335px;
top: 748px;
}
#apDiv3 {
position:absolute;
width:330px;
height:338px;
z-index:6;
left: 276px;
top: 133px;
}
.a { font-weight: bold;
}
.a { font-weight: bold;
}
.c { font-weight: bold;
}
.p { font-weight: bold;
}
.p { font-weight: bold;
}
#apDiv4 {
position:absolute;
width:752px;
height:2px;
z-index:5;
left: 15px;
top: 963px;
}
#apDiv5 {
position:absolute;
width:200px;
height:115px;
z-index:6;
left: 284px;
}
#apDiv6 {
position:absolute;
width:75px;
height:21px;
z-index:6;
top: 1360px;
left: 17px;
}
#apDiv7 {
position:absolute;
width:120px;
height:21px;
z-index:7;
left: 168px;
top: 1361px;
}
#apDiv8 {
position:absolute;
width:71px;
height:19px;
z-index:8;
left: 294px;
top: 1361px;
text-align: center;
}
#apDiv9 {
position:absolute;
width:75px;
height:22px;
z-index:9;
top: 1361px;
text-align: center;
left: 364px;
}
#apDiv10 {
position:absolute;
width:30px;
height:26px;
z-index:10;
}
#apDiv11 {
position:absolute;
width:29px;
height:25px;
z-index:10;
left: 312px;
top: 1065px;
}
#apDiv12 {
position:absolute;
width:29px;
height:31px;
z-index:10;
}
#apDiv13 {
position:absolute;
width:172px;
height:34px;
z-index:6;
left: 347px;
top: 604px;
background-image: url(image005.png);
}
#apDiv14 {
position:absolute;
width:148px;
height:32px;
z-index:10;
left: 365px;
top: 532px;
}
#apDiv15 {
position:absolute;
width:119px;
height:28px;
z-index:11;
left: 339px;
top: 803px;
background-color: #FF9900;
}
#apDiv16 {
position:absolute;
width:214px;
height:32px;
z-index:12;
left: 324px;
top: 599px;
color: #000;
}
#apDiv17 {
position:absolute;
width:143px;
height:23px;
z-index:13;
left: 358px;
top: 645px;
}
#apDiv18 {
position:absolute;
width:59px;
height:43px;
z-index:14;
left: 470px;
top: 694px;
background-color: #FF9900;
}
#apDiv19 {
position:absolute;
width:150px;
height:23px;
z-index:15;
left: 345px;
top: 546px;
}
#apDiv {
position:absolute;
width:59px;
height:29px;
z-index:14;
left: 460px;
top: 802px;
background-color: #FF9900;
}
#apDiv20 { position:absolute;
width:59px;
height:43px;
z-index:14;
left: 470px;
top: 694px;
background-color: #FF9900;
}
#apDiv21 {
position:absolute;
width:200px;
height:27px;
z-index:16;
left: 15px;
top: 79px;
}
#apDiv22 {
position:absolute;
width:200px;
height:115px;
z-index:16;
}
#apDiv23 {
position:absolute;
width:200px;
height:115px;
z-index:1;
}
#apDiv24 {
position:absolute;
width:144px;
height:118px;
z-index:17;
left: 647px;
top: 194px;
color: #F60;
}
#apDiv24 p {
text-align: center;
font-weight: bold;
color: #000;
}
#apDiv25 {
position:absolute;
width:200px;
height:26px;
z-index:18;
left: 621px;
top: 219px;
font-weight: bold;
text-align: center;
}
#apDiv26 {
position:absolute;
width:200px;
height:26px;
z-index:19;
left: 295px;
top: 321px;
}
#apDiv27 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: -72px;
top: 1196px;
}
#form1 table tr td {
text-align: center;
font-weight: bold;
}
#apDiv28 {
position:absolute;
width:200px;
height:115px;
z-index:20;
}
#apDiv29 {
position:absolute;
width:310px;
height:115px;
z-index:21;
left: 279px;
top: 543px;
}
#apDiv30 {
position:absolute;
width:301px;
height:115px;
z-index:20;
left: 288px;
top: 534px;
}
#apDiv31 {
position:absolute;
width:92px;
height:23px;
z-index:21;
top: 1363px;
}
#apDiv32 {
position:absolute;
width:64px;
height:26px;
z-index:22;
left: 98px;
top: 1360px;
}
#apDiv33 {
position:absolute;
width:79px;
height:115px;
z-index:23;
top: 1395px;
left: 16px;
}
#apDiv34 {
position:absolute;
width:64px;
height:115px;
z-index:24;
top: 1415px;
}
#apDiv35 {
position:absolute;
width:121px;
height:115px;
z-index:25;
top: 1397px;
left: 170px;
}
#apDiv36 {
position:absolute;
width:64px;
height:115px;
z-index:26;
left: 295px;
top: 1396px;
}
#apDiv37 {
position:absolute;
width:71px;
height:115px;
z-index:27;
top: 1394px;
}
#apDiv38 {
position:absolute;
width:91px;
height:115px;
z-index:28;
top: 1414px;
}
#apDiv39 {
position:absolute;
width:308px;
height:115px;
z-index:29;
left: 287px;
top: 796px;
}
</style>
</head>
<body onLoad="DrawCaptcha()">
<body background="fondo026.jpg">
<p> </p>
<table width="812" height="333" border="1">
<tr>
<td width="257"><div style="position: absolute; width: 203px; height: 119px; z-index: 1; left: 47px; top: 124px" id="capa1">
<p><span class="letra-inicial"><strong>N</strong></span><strong class="titulos">utrilife.net </strong><br />
<strong>Juntas de Oportunidad Nutriser Bogotá D.C</strong><br />
Hotel Laureles 70 Circular 5 # 70- 13<br />
Martes y Jueves 7:00 pm<br />
Fijo.<span class="skype_pnh_dropart_flag_span" style="BACKGROUND-POSITION: -5849px 1px">(057</span>) <span class="skype_pnh_print_container">2821403</span><span dir="ltr" class="skype_pnh_container" tabindex="-1"><span dir="ltr" class="skype_pnh_highlighting_inactive_common" title="Llamar a este número de teléfono en Estados Unidos de América con Skype: +15743360786 "><span class="skype_pnh_left_span" skypeaction="skype_dropdown"> </span><span class="skype_pnh_dropart_span" title="Acciones de Skype" skypeaction="skype_dropdown"><span style="BACKGROUND-POSITION: -5849px 1px" class="skype_pnh_dropart_flag_span" skypeaction="skype_dropdown"> </span></span></span></span></p>
<p><span dir="ltr" class="skype_pnh_container" tabindex="-1"><span dir="ltr" class="skype_pnh_highlighting_inactive_common" title="Llamar a este número de teléfono en Estados Unidos de América con Skype: +15743360786 "><span class="skype_pnh_dropart_span" title="Acciones de Skype" skypeaction="skype_dropdown"><span style="BACKGROUND-POSITION: -5849px 1px" class="skype_pnh_dropart_flag_span" skypeaction="skype_dropdown">Celular: 3202691138 </span> </span></span></span></p>
<p><br />
Bogota D.C (Cund)- Colombia</p>
</div></td>
<td width="316"><div style="position: absolute; width: 114px; height: 25px; z-index: 2; left: 412px; top: 15px" id="capa3"> <strong><span class="letra-inicial"><font size="5">C</font></span></strong><strong class="titulos"><font size="5">ontacto</font></strong></div>
<form id="form1" name="form1" method="post" action="enviar_datos2.php" onSubmit="return checkFields2();">
<p> </p>
<p>
<label for="Nombre5"> Nombre: </label>
<input name="Nombre5" type="text" id="Nombre5" size="40" /> <!-- antes estaba $_SESSION -->
</p>
<p>
<label for="Apellido5"> Apellido</label>
:
<input name="Apellido5" type="text" id="Apellido5" size="40" />
</p>
<p>
<label for="Email5"> Email:</label>
<input name="Email5" type="text" id="Email5" size="40"/>
</p>
<p>
<label for="Paisciudad5"> Pais_Ciudad:</label>
<input name="Paisciudad5" type="text" id="Paisciudad5" size="35" />
</p>
<p> Eres afilido(a) a Omnilife?
<!-- <label for="Si">Si
<input type="radio" name="radio" id="Si" Value="Si" />
</label>
<label for="No">No</label>
<input type="radio" name="radio" id="No5" Value="No" /> -->
<label for="Si">Si</label>
<input name="radio" type="radio" id="Si" value="1"/>
</label>
<label for="No">No</label>
<input name="radio" type="radio" id="No" value="0"/>
</p>
<p> </p>
<div id="apDiv26">Mensaje:</div>
<p>
<textarea name="Mensaje5" cols="40" rows="10" id="Mensaje5"></textarea>
</p>
<p>
</p>
<table width="306">
<tr>
<td><p>
<input type="text" name="txtCaptcha" id="txtCaptcha"
style="background-image:url(120.jpg); text-align:center; border:none;
font-weight:bold; font-family:Modern" />
</p>
<p>
<input type="button" id="btnrefresh" onClick="DrawCaptcha();" value="No puedes ver esta imágen?" />
</p></td>
</tr>
<tr>
<td><p>Favor ingrese código de verificación:
<input name="txtInput" type="text" id="txtInput"/>
<!-- <input id="Button1" type="button" value="Check" onClick="alert(ValidCaptcha());"/> -->
</p></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
<p>
</p>
<p>
</p>
<p>
<label for="captcha"></label>
</p>
<p> </p>
<div id="apDiv15">
<input type="submit" name="Enviar" id="Enviar" value="Enviar" onclik="checkFields2()"/>
</div>
<p> </p>
</form>
<div id="apDiv">
<input type="button" name="Borrar2" id="Borrar2" value="Borrar" onClick="Borrar()"/>
</div>
<p> </p></td>
<td width="217"><div id="apDiv24">
<p> </p>
</p>
<p>> <a target="_blank" href="http://www.omnilife.com/">Omnilife Oficial</a><br/>
> <a target="_blank" href="http://www.omnilife.com/nico">Omnilife NICO </a><br/>
> <a href="http://www.omnilife.com/radio/">Omnilife Radio</a><br/>
> <a target="_blank" href="http://www.nutriser.org/">Nutriser.org</a><br/>
> <a target="_blank" href="http://www.creser.gentedenegocio.net/">CreSer</a><br/>
> <a href="http://www.angelisima.com.mx/">Angelíssima</a></p>
<p> </p>
</div>
<div id="apDiv25">Web amigas</div></td>
</tr>
</table>
<blockquote>
<p> </p>
</blockquote>
<p>
<?php error_reporting(E_ALL & ~E_NOTICE); ?>
<script type="text/javascript">
//Created / Generates the captcha function
function DrawCaptcha()
{
var aLetras = new Array('A', 'B', 'C','D', 'E', 'F','G', 'H', 'I','J', 'K', 'L','M', 'N', 'O','P', 'Q', 'R','S', 'T', 'U','V', 'W', 'X','Y', 'Z');
var a = Math.ceil(Math.random() * 10)+ '';
var b = Math.ceil(Math.random() * 10)+ '';
var c = Math.ceil(Math.random() * 10)+ '';
var d = Math.ceil(Math.random() * 10)+ '';
var cLetra = aLetras[Math.floor(Math.random()*aLetras.length)];
var code = a + ' ' + b + ' ' + ' ' + c + ' ' + d + ' ' + cLetra;
document.getElementById("txtCaptcha").value = code
}
// Validate the Entered input aganist the generated security code function
/*function ValidCaptcha(){
var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
var str2 = removeSpaces(document.getElementById('txtInput').value);
if (str1 == str2) return true;
return false;
} */
// Remove the spaces from the entered and generated code
function removeSpaces(string)
{
return string.split(' ').join('');
}
</script>
<script type="application/javascript">
function Borrar(BuzonMensajes2)
{
document.form1.Nombre5.value= "";
document.form1.Nombre5.focus()
document.form1.Apellido5.value= "";
document.form1.Email5.value= "";
document.form1.radio[0].checked=0;
document.form1.radio[1].checked=0 ;
document.form1.Paisciudad5.value = "";
document.form1.Mensaje5.value = "";
document.form1.Validatexto.value = "";
document.form1.txtInput.value = "";
}
</script>
<?php
/* Este código esta bien 3 de febrero 2012:
set_time_limit(120);
$link=mysql_connect("localhost","root","califele2011");
mysql_select_db("omnilife",$link);
$asunto = 'Prueba';
$mensaje = 'Buenas que tal';
$sql1 = mysql_query('SELECT EmailB FROM buzon');
while ($mail = mysql_fetch_array($sql1)){
mail($mail['EmailB'],$asunto,$mensaje);
echo $mail["EmailB"];
echo '- Email:';
echo "<br>";
}
*/
?>
<table width="108%" border="1">
<tr>
<td width="96" height="98"><p align="center"><font size="2"><b>Nuestros enlaces:</b></font><b><font size="2"> </font></b></p></td>
<td width="43"><img src="indice1.jpg" alt="" width="42" height="41" border="0" /></td>
<td width="44"><img src="indice3.jpg" alt="" width="44" height="40" border="0" /></td>
<td width="54"><img src="indice4.jpg" alt="" width="54" height="37" border="0" /></td>
<td width="41"><img src="indice5.jpg" alt="" width="41" height="40" border="0" /></td>
<td width="71"><p><b><font face="Arial"><font size="1">Empresario
Mercantil independiente</font></font></b></p>
<p><span style="mso-ignore:vglayout; position:absolute; z-index:1; left:43px; top:1330px; width:24px; height:0px"><img
src="Pie%20de%20pagina_archivos/image002.gif" alt="" width="24" height="23" v:shapes="_x0000_s1033" /></span></p>
<p> </p></td>
<td width="114"><img src="OMILIFE.jpg" alt="" width="110" height="35" border="0" align="right" /></td>
<td width="116"><img src="Angelissima.jpg" alt="" width="116" height="35" border="0" align="right" /></td>
<td width="102"><img src="Kenya.jpg" alt="" width="102" height="50" border="0" align="right" /></td>
</tr>
</table>
<table width="800" height="132" border="1">
<tr>
<td width="129"><img src="Productos.jpg" alt="" width="128" height="127" /></td>
<td width="125"><img src="Afiliacion.jpg" alt="" width="125" height="126" /></td>
<td width="126"><img src="Centro de apoyo.jpg" alt="" width="125" height="129" /></td>
<td width="127"><img src="Recursos.jpg" alt="" width="125" height="126" /></td>
<td width="130"><img src="Blog.jpg" alt="" width="128" height="126" /></td>
<td width="131"><img src="Contacto.jpg" alt="" width="125" height="126" /></td>
</tr>
</table>
<table width="800" height="333" border="1">
<tr>
<td width="79" height="327" bgcolor="#CCCCCC"><p class="p"> </p>
<div id="apDiv6"><span class="p">Productos</span></div>
<p class="p"> </p>
<div id="apDiv33">
<p>Nutricionales</p>
<p>Cosmeticos</p>
<p>Cremas</p>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="63" bgcolor="#CCCCCC"><p><span style="mso-ignore:vglayout; position:absolute; z-index:1; left:120px; top:1327px; width:20px; height:26px"><img
src="Pie%20de%20pagina_archivos/image004.gif" alt="" width="24" height="23" v:shapes="_x0000_s1035" /></span></p>
<div id="apDiv32"><span class="a">Afiliación</span></div>
<p> </p>
<p> </p>
<div id="apDiv34">Negocio</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="122" bgcolor="#CCCCCC"><p><span class="c"><span style="mso-ignore:vglayout; position:absolute; z-index:1; left:215px; top:1327px; width:22px; height:21px"><img
src="Pie%20de%20pagina_archivos/image003.gif" alt="" width="24" height="23" v:shapes="_x0000_s1034" /></span></span></p>
<div id="apDiv7"><span class="c">Centros de apoyo</span></div>
<div id="apDiv35">
<p>Bogotá</p>
<p>Virtual</p>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="63" bgcolor="#CCCCCC"><strong><span style="mso-ignore:vglayout; position:absolute; z-index:1; left:320px; top:1328px; width:19px; height:18px"><img
src="Pie de pagina_archivos/image007.gif" alt="" width="24" height="23" v:shapes="_x0000_s1028" /></span></strong>
<p> </p>
<div id="apDiv8"><strong>Recurso</strong>s</div>
<p> </p>
<div id="apDiv36">
<p>Nutrilife</p>
<p>Omnilife</p>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="72" bgcolor="#CCCCCC"><span style="mso-ignore:
vglayout; position:absolute; z-index:1; left:391px; top:1326px; width:22px; height:21px"><img
src="Pie%20de%20pagina_archivos/image001.gif" alt="" width="24" height="23" v:shapes="_x0000_s1027" /></span>
<div id="apDiv37">
<p>Información</p>
<p>Eventos</p>
<p>Fotos</p>
<p>Videos</p>
</div>
<p> </p>
<div id="apDiv9"><strong>Blog</strong></div>
<p> </p>
<p> </p>
<p></p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="91" bgcolor="#CCCCCC"><strong><span style="mso-ignore:vglayout; position:absolute; z-index:1; left:476px; top:1326px; width:22px; height:21px"><img
src="Pie de pagina_archivos/image005.gif" alt="" width="24" height="23" v:shapes="_x0000_s1028" /></span></strong>
<p> </p>
<div id="apDiv31"><strong>Contactos</strong></div>
<p> </p>
<div id="apDiv38">Formulario</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="264" bgcolor="#CCCCCC">
<div id="apDiv22">
<div id="apDiv23"></div>
</div>
<div id="capa2">
<p align="center"> <strong> Olga Lucia Martínez ǀ Leonardo Curcho.</strong></p>
<div id="capa4"> Nutrilife ...Num. Tel. Fijo: (2821403) Móvil 3202691138</div>
<p align="center"> Empresarios Bronce Omnilife</p>
<p> </p>
</div> </td>
</tr>
</table>
<p> </p>
</body>
</html>
Gracias.
Entre otras muchas cosas, los navegadores interpretan el código como ellos quieren, por ejemplo las tablas en algunos casos (si se les aplica el css border) leen los bordes haci dentro o hacia fuera, dependiendo del navegador.
Luego, tienes muchos espacios en blanco y demasíados saltos de linea con <p> lo que hace que el navegador pueda interpretarlo un poco como quiere.
Tendrías que controlar todo ese tipo de cosas con CSS y no con <p>.
Luego, no tienes las cosas ordenadas por divs si no que tiras de tablas, esa forma de maquetar HTML es muy antigua y ya no se usa, se usan divs para poder colocar todo en su sitio y de ese modo "centrarlo" o "colocarlo" donde nosotros queramos con CSS.
Tienes bastantes fallo en ese sentido que hacen que la web quede muy a disposición de ser dibujada por el navegador, lo que hace que cada navegador le de su toque y por tanto en cada uno se vea diferente.
- Compartir respuesta