mal en firefox, bien en ie....

Snake nS · #1 (**permalink**) 14/07/2005, 17:05

Tengo un cuadro de seleccion, al cual llamo mediante un include.

Al querer centrarlo, modifique el archivo fuente (include) quedando asi:

Código:

<p align="center"><SELECT class=select2 name=cat 
            onchange="location.href=options[selectedIndex].value; return true;" size="1" style="font-family: Verdana; font-size: 9px; color: #008000; font-weight: bold">
              <option selected>Tu Provincia</option> 
              <option value="------------">------------</option>
              <option>Buenos Aires</option>
              <option>Cordoba</option>
              </SELECT>
</p>

Bueno, cuando ejecuto la web en ie se ve centrado en la capa correspondiente mientras que en firefox se sale de la capa y se va hacia abajo:

Código:

</div>
	    <div id="arriba2"></div>

	    <div class="contiene1">
            <div class="izquierda1"><p align="center"><SELECT class=select2 name=cat 
            onchange="location.href=options[selectedIndex].value; return true;" size="1" style="font-family: Verdana; font-size: 9px; color: #008000; font-weight: bold">
              <option selected>Tu Provincia</option> 
              <option value="------------">------------</option>
              <option>Buenos Aires</option>
              <option>Cordoba</option>

              </SELECT>
</p>
</div>

Snake nS · #2 (**permalink**) 16/07/2005, 18:52

Ninguna idea???

SiR.CARAJ0DIDA · #3 (**permalink**) 16/07/2005, 20:20

no se entiende el problema.. ahi hay un </div> arriba de todo que tiene que ir al final.

Snake nS · #4 (**permalink**) 16/07/2005, 22:51

Es simple, el cuadro de seleccion en firefox no se visualisa dentro de la capa donde deberia estar, ese div esta bien, corresponde al codigo anterior a eso.

El 1 codigo corresponde al archivo include, mientras que el 2 corresponde a la web que llama al include.

Durgeoble · #5 (**permalink**) 17/07/2005, 02:44

Snake toma esto por norma, en IE el 90% de los casos se vera mal (aunque se vea como quieres) en firefox el 90% de los casos se ve bien (aunque no se vea como tu quieres)

Por otro lado el codigo HTML sin el codigo CSS no sirve de nada, a la inversa tampoco y lo mejor en estos casos es

tener la pagina completa (imagenes incluidas) para poder ver los fallos
tener un link a la pagina para poder verla online

Estoy seguro de que si la capa se desplaza es porque debe desplazarse.

Snake nS · #6 (**permalink**) 17/07/2005, 12:56

Código:

body {
     background-color: #CCCCCC; 	
     margin-left: 0px;
     margin-top: 0px;
     margin-right: 0px;
     margin-bottom: 0px;
     }

/*Capa Ancla*/
#capamadre { height: 100%; width: 779px; margin:auto;}

/*Canesera*/
#arriba1 { height: 15px; width: 779px; padding: 0pt; overflow: hidden; background-image: url(../Images/design_01.gif); font-size: 8px; text-align: right}
#arriba2 { height: 59px; width: 779px; background-image: url(../Images/design_02.gif)}

/*Menu Horizontal*/
.contiene1 { width: 100%; height:24px }
.izquierda1 { width:123px; height:24px; float:left; background-image: url(../Images/Design2-remix_02.gif);}
.derecha1 { width:656px; height:24px; float:right; background-image: url(../Images/barraremix.gif); font-size:14px;  line-height: 23px; text-indent: 16px; font-weight: bold; font-family: Verdana; color:#24C679;}

/*Capa efecto sombra paralela*/
#arriba3 { height: 9px; width: 779px; padding: 0pt; overflow: hidden; background-image: url(../Images/design_12.gif);}

/*Capa fragmento menu lateral - capa descripcion celda contenido*/
.contiene2 {width:100%; height:19px }
.izquierda2 {width:140px; height:19px; float:left; background-image: url(../Images/design-2_02.gif);}
.derecha2 {width:639px; height:19px; float:right; background-image: url(../Images/barra-temas.gif); }

/*Menu lateral - Capa contenido*/
.contiene3 {width:100%; height:447px }
.menulateral {width:140px; height:447px; float:left; background-image: url(../Images/design-2_04.gif);}
.capacontenido {width:639px; height:447px; float: right; background-color: #A3A3A3;}

/*Pie de pagina*/
#footer { height: 27px; width: 779px; background-image: url(../Images/design_18.gif)}


/*Propiedades de Spans-Footer*/
.spanfooter {
float:left;
line-height:27px;
font-size:14px;
text-indent:2px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
.spanfooter2 {
float:right;
line-height:27px;
font-size:14px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

Snake nS · #7 (**permalink**) 17/07/2005, 12:57

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html lang="es" xml:lang="es" xmlns="http://www.w3.org/1999/xhtml">

            
            <head>
	    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
	    <meta name="generator" content="Notepad" />
	    <title>Unitled</title>
            <link href="template/style.css" rel="stylesheet" type="text/css" />
            </head>

            <body>

            <div id="capamadre">
	    <div id="arriba1"></div>
	    <div id="arriba2"></div>

	    <div class="contiene1">
            <div class="izquierda1"><p align="center"><SELECT class=select2 name=cat 
            onchange="location.href=options[selectedIndex].value; return true;" size="1" style="font-family: Verdana; font-size: 9px; color: #008000; font-weight: bold">
              <option selected>Tu Provincia</option> 
              <option value="------------">------------</option>
              <option>Buenos Aires</option>
              <option>Cordoba</option>

              </SELECT>
</p>
</div>
            <div class="derecha1"></div>
            </div>
			
            <div id="arriba3"></div>

            <div class="contiene2">
            <div class="izquierda2"></div>
            <div class="derecha2"></div>

            </div>

            <div class="contiene3">
            <div class="menulateral"></div>
            <div class="capacontenido"></div>
            </div>

            <div id="footer"><div><span class="spanfooter">&copy; 2005 - Derechos Reservados</span><span class="spanfooter2">Condiciones de Uso | Publicite | Nosotros | Contacto</span></div>

</div>
	    </div>
            
            </body>
            </html>

La primera corresponde a firefox, la 2 a ie (imagenes)

kemie · #8 (**permalink**) 18/07/2005, 02:31

tienes errores en tu html, por ejemplo, en vez de:
class=select2
deberia de ser:
class="select2"

te recomiendo que valides tu html y css, te puede solucionar muchos problemas.

Durgeoble · #9 (**permalink**) 18/07/2005, 12:35

select debe estar dentro de un form
y valida tu pagina, encontraras algunas sorpresas (por ejemplo align="center" no existe en xhtml)
<?xml version="1.0" encoding="iso-8859-1"?> ejemplo de linea ANTES del doctype

Snake nS · #10 (**permalink**) 18/07/2005, 13:57

Cual es la sustitucion de align="center" en xhtml???

Durgeoble · #11 (**permalink**) 18/07/2005, 14:32

margin: auto; para "no texto" text-align: center; para texto

Snake nS · #12 (**permalink**) 18/07/2005, 17:26

Suprimi align center, agregue margin: auto al selector izquierda1, tambien probe con margin-left: auto, margin-right:auto... pero no consigo centrarlo, pero se ve dentro de la capa.

Código:

.izquierda1 { width:123px; height:24px; float:left; margin-left: auto; margin-right: auto; background-image: url(../Images/Design2-remix_02.gif);}

Código:

     <div class="izquierda1"><SELECT class="select2" name="cat" 
            onchange="location.href=options[selectedIndex].value; return true;" size="1" style="font-family: Verdana; font-size: 9px; color: #008000; font-weight: bold">
              <option selected>Tu Provincia</option> 
              <option value="------------">------------</option>
              <option>Buenos Aires</option>
              <option>Cordoba</option>

Durgeoble · #13 (**permalink**) 18/07/2005, 22:55

¿validaste? ¿pusiste el select dentro de un form?
Si haces las cosas a medias es normal que no vayan
hay fallos en la pagina que salen en el validador del w3c

Snake nS · #14 (**permalink**) 18/07/2005, 23:05

Que es un form????

c0lo · #15 (**permalink**) 18/07/2005, 23:36

form es un formulario.

te estan diciendo que pongas esta etiqueta
<select name="select">
</select>, dentro de un <form action=""> </form>.

Seria asi.

<form action="">
<select name="asdsa" todo tu codigo....>
</select>
</form>

kemie · #16 (**permalink**) 19/07/2005, 00:33

valida, valida, valida!

Snake nS · #17 (**permalink**) 19/07/2005, 17:32

Uno menos que el otro entiendo.....

Cita:

Line 20, column 64: there is no attribute "class"

... <div class="izquierda1"> <SELECT class="select2" name="cat"

You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute.

Cita:

Line 20, column 79: there is no attribute "name"

... <SELECT class="select2" name="cat"

Cita:

Line 21, column 23: there is no attribute "onchange"

onchange="location.href=options[selectedIndex].value; return true;

Cita:

Line 21, column 87: there is no attribute "size"

...ctedIndex].value; return true;" size="1" style="font-family: Verdana; font-si

Cita:

Line 21, column 97: there is no attribute "style"

....value; return true;" size="1" style="font-family: Verdana; font-size: 9px; c

Cita:

Line 21, column 170: element "SELECT" undefined

...x; color: #008000; font-weight: bold">

You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Frameset" document type to get the "<frameset>" element), or by using vendor proprietary extensions such as "<spacer>" or "<marquee>" (this is usually fixed by using CSS to achieve the desired effect instead).

Cita:

Line 22, column 30: the name and VI delimiter can be omitted from an attribute specification only if SHORTTAG YES is specified

<option selected>Tu Provincia</option>

Quiere decir que todos esos atributos no existen en xhtml!!¿¿??

Durgeoble · #18 (**permalink**) 19/07/2005, 23:02

snake, ¿tu lees lo que se te pone?
select es parte de un elemento form, si no esta dentro de un elemento form (tal y como te puso colo) esta mal puesto, tu pretendes solucionar fallos saltandote los pasos y eso no es posible.
Esos atributos si existen en xhtml pero al estar en un lugar que no le corresponde (recuerda el select no esta en su sitio) el validados no los toma como validos.

Snake nS · #19 (**permalink**) 19/07/2005, 23:07

Cuando puse todo el codigo dentro del select gane mas errores todavia...

Código:

<form action="">
<select name="asdsa"<SELECT class="select2" name="cat" 
            onchange="location.href=options[selectedIndex].value; return true;" size="1" style="font-family: Verdana; font-size: 9px; color: #008000; font-weight: bold">
              <option selected>Tu Provincia</option> 
              <option value="------------">------------</option>
              <option>Buenos Aires</option>
              <option>Cordoba</option>>
</select>
</form>

Durgeoble · #20 (**permalink**) 19/07/2005, 23:11

Cita:

Iniciado por Snake nS

Código:

<form action="">
<select name="asdsa"<SELECT class="select2" name="cat"

¿No te resulta extraño abrir una etiqueta identica a la anterior "dentro" de la etiqueta anterior ?
Por cierto ¿con que programas editas tus paginas?

Snake nS · #21 (**permalink**) 20/07/2005, 01:16

Sip, eso me paso por la cabesa, pero como entendi mal el ejemplo en el momento que citaron el codigo pense que hacia referencia a todo el mismo, y recien me acabo de dar cuenta que tenia dos name="" jejejejeje......

Bloc de notas - dreamweaver... no manejo el codigo pero lo entiendo.

Cita:

Line 22, column 30: the name and VI delimiter can be omitted from an attribute specification only if SHORTTAG YES is specified

<option selected>Tu Provincia</option>

Cita:

Line 25, column 38: character data is not allowed here

<option>Cordoba</option>>

You have used character data somewhere it is not permitted to appear. Mistakes that can cause this error include putting text directly in the body of the document without wrapping it in a container element (such as a <p>aragraph</p>) or forgetting to quote an attribute value (where characters such as "%" and "/" are common, but cannot appear without surrounding quotes).

Solo quedaron estos 2 que no se bien a que se refieren, igualmente sigue sin aparecer centrado el cuadro de seleccion.

kemie · #22 (**permalink**) 20/07/2005, 03:38

<option>Cordoba</option>> deberia de ser
<option>Cordoba</option>
(tienes doble >)

c0lo · #23 (**permalink**) 20/07/2005, 03:42

esto me pasa por no leer todo completo :P, perdon.. no dije nada

editado

Snake nS · #24 (**permalink**) 20/07/2005, 14:38

Código:

<option>Cordoba</option>> deberia de ser
<option>Cordoba</option>
(tienes doble >)

Sip, siempre estuvo asi. no se porque tira ese error la verdad, aunque cuando el include esta generado solo tira el 1 error.

Durgeoble · #25 (**permalink**) 20/07/2005, 14:59

Un consejo, deja el bloc de notas y usa pspad
Es muchisimo mejor y ademas en español

Snake nS · #26 (**permalink**) 20/07/2005, 15:54

Muchas gracias, lindo programa.

Solo tengo este error que corregir que no se para que lado tirar:

Código:

Line 22, column 30: the name and VI delimiter can be omitted from an attribute specification only if SHORTTAG YES is specified

<option selected>Tu Provincia</option>

En cuanto al cuadro sigue sin estar centrado....... el css tiene cada cosa

Durgeoble · #27 (**permalink**) 20/07/2005, 16:42

selected quitalo,y a mi me aparece bien el cuadro (sera que cuando lo mire habia revisado un pelin el codigo "quitando selected entre otros")
aunque creo que lo que te dice es que pongas -->selected="yes"<--

Snake nS · #28 (**permalink**) 20/07/2005, 16:55

Ya lo corregi, en realidad era cuestion de poner: selected="selected"......

El problema ahora que tengo todo validado son dos:

Primero en ie se ve mal,una capa se desplaso hacia abajo, justamente la que esta debajo del cuadro de seleccion.... Si quito el form, se arregla.

En firefox va todo perfecto, exepto que el cuadro de seleccion sigue sin estar centrado... lo mismo en ie.

Parece que consegui mas errores validando el codigo.

Durgeoble · #29 (**permalink**) 20/07/2005, 22:44

edita el post del codigo con el codigo nuevo y asi se vera, si una cosa no va como esperabamos no es por validarla, es porque se ha definido algo mal aunque sintacticamente este bien.

Snake nS · #30 (**permalink**) 21/07/2005, 02:25

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html lang="es" xml:lang="es" xmlns="http://www.w3.org/1999/xhtml">

            
            <head>
	    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
            <title>Unitled</title>
	    <meta name="generator" content="Notepad" />
            <link href="template/style.css" rel="stylesheet" type="text/css" />
            </head>

            <body>

            <div id="capamadre">
	    <div id="arriba1"></div>
	    <div id="arriba2"></div>

	    <div class="contiene1">
            <div class="izquierda1"><form action="">              
              <select class="select2" name="cat"
              onchange="location.href=options[selectedIndex].value; return true;"               size="1" style="font-family:Verdana;               font-size: 9px; color: #008000; font-weight: bold">
              <option selected="selected">Tu Provincia</option> 
              <option value="">------------</option>
              <option>Buenos Aires</option>

              <option>Cordoba</option>
              </select>
              </form>
              
</div>
            <div class="derecha1"></div>
            </div>
			
            <div id="arriba3"></div>

            <div class="contiene2">
            <div class="izquierda2"></div>
            <div class="derecha2"></div>
            </div>

            <div class="contiene3">
            <div class="menulateral"></div>
            <div class="capacontenido"></div>
            </div>

            <div id="footer"><div><span class="spanfooter">&copy; 2005 - Derechos Reservados</span><span class="spanfooter2">Condiciones de Uso | Publicite | Nosotros | Contacto</span></div>

</div>
	    </div>
            
            </body>
            </html>