Cuando?

kisquain · #1 (**permalink**) 13/02/2009, 18:47

Cuando utiilizar las propiedades float?
Cuando utilizar position relative o absolute?

Gracias desde ya, es que soy novato y mi duda es esa. Saludos!

willyfc · #2 (**permalink**) 13/02/2009, 19:06

pues eso depende de lo que quieras hacer, cada uno tiene su caso, por ejemplo:

si yo quiero hacer un diseño a 2 o 3 columnas lo mas practico sería que utilizar float, por ejemplo:

Código css:

Ver original<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
#contenedor{width:770px; height:400px; margin:0 auto;}
#cabecera{widows:770px; height:80px; text-align:center; background-color:#999900;}
#contenido{width:770px; height:300px;}
#col_izq,#col_der{ width:100px; background-color:#999; border:1px solid #333; height:299px;}
#col_izq{float:left}
#col_der{float:right;}
#centro{width:556px; height:299px; float:left;}
#pie{width:770px; height:18px; clear:both; background-color:#333; text-align:center;}
</style>
</head>
 
<body>
<div id="contenedor">
    <div id="cabecera">cabera</div>
    <div id="contenido">
        <div id="col_izq"></div>
        <div id="centro"></div>
        <div id="col_der"></div>
    </div>
    <div id="pie">pie</div>
</div>
</body>
</html>

y los absolutos al menos yo los uso en ocasiones especiales, ojo digo al menos yo, por ejemplo cuando quiero montar un div sobre otro o cuando quiero posicionar una caja, ahora tambien debes saber que el contenga al absoluto tiene que ser relativo, es lo que pienso yo asi tengo un mejor control sobre el:

Código css:

Ver original<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
#contenedor{width:770px; height:400px; margin:0 auto; position:relative; border:1px solid #333;}
#cabecera{width:770px; height:100px; background-color:#00CC00;}
#absoluto{width:200px; height:200px; background-color:#333; left:10&#37;;top:2%; position:absolute;}
</style>
</head>
 
<body>
<div id="contenedor">
    <div id="cabecera"></div>
    <div id="absoluto"> </div>
</div>
</body>
</html>

espero haberme dejado entender.

kisquain · #3 (**permalink**) 13/02/2009, 19:10

Si, algo he entendido..

Es que, si yo qiero hacer dos culomnas, coloca la primera con float left, y ¿puedo colocar la segunda con position relative?

Eso de superponer una caha con otra, no puedo hacerlo con margin negativos?

Gracias!

Mikmoro · #4 (**permalink**) 13/02/2009, 19:17

Cita:

Iniciado por kisquain

Cuando utiilizar las propiedades float?
Cuando utilizar position relative o absolute?

Gracias desde ya, es que soy novato y mi duda es esa. Saludos!

¿Cuándo? cuando hagan falta, cada una de ellas en unos pocos miles de ocasiones diferentes. Es absolutamente indeterminable caso por caso, y mucho menos hacer una relación.

willyfc ha sido muy amable en su explicación, pero... ¿realmente sabes cómo funcionan tanto el flotado como las posiciones? Si la respuesta es no o "no del todo", ¿cómo vas a saber cuándo usar cada una de ellas?

willyfc · #5 (**permalink**) 13/02/2009, 19:29

Mik la verdad "no del todo", por eso dije varias veces al menos yo, por ejemplo no se si mi forma de ver esto sea correcta, pero yo trato de utilizar lo menos que pueda los absolutos(esto por que no los domino muy bien que digamos), por eso hago uso de ellos expresamente cuando pienso yo que los necesito. quizá me limito por no saber exactamente como funcionan

Cita:

¿Cuándo? cuando hagan falta, cada una de ellas en unos pocos miles de ocasiones diferentes. Es absolutamente indeterminable caso por caso, y mucho menos hacer una relación.

pues dandome cuenta debi solo haber escrito lo que usted puso

, no lo había visto de esa manera, y pues me remito.

kisquain · #6 (**permalink**) 13/02/2009, 19:33

Flotado, claro que si. El div flota hacia la derecha o izquierda.

Posiciones, es en lo que quiero afirmar mis conocimientos; es decir, si yo utilizo posicion absolute la posicion del div será posicionada respecto a el punto superior izquierda del div padre. Y relative es posicionado respecto a el div que le sigue. (Creo, lo escribi tambaleando la mano esto ultimo).

El caso es que, no se cuando utilizar. Ya que si quiero colocar un menu a la derecha, justo a 10 pixeles de un logo; puedo utilizar position relative, no? O float right directamente?

Entienden? Esa es mi pregunta, muchas gracias a todos por contestarme.

Mikmoro · #7 (**permalink**) 13/02/2009, 19:35

willyfc: supongo que has entendido que la pregunta de si sabes cómo funcionan no era para ti, sino para kisquain, ¿no? (por si acaso, es que tu respuestsa me ha hecho dudar).

willyfc · #8 (**permalink**) 13/02/2009, 19:40

pues si Mik la entendí para mí

y

, pero si luego de tu post me di cuenta de que era suficiente con

Cita:

¿Cuándo? cuando hagan falta, cada una de ellas en unos pocos miles de ocasiones diferentes. Es absolutamente indeterminable caso por caso, y mucho menos hacer una relación.

aunque creo trate de ser lo mas claro posible explicando de la forma que yo lo veía

Mikmoro · #9 (**permalink**) 13/02/2009, 19:40

Cita:

Iniciado por kisquain

Entienden? Esa es mi pregunta, muchas gracias a todos por contestarme.

Se te entiende perfectamente, pero la respuesta es la misma:
1.- no hay una manera de determinar cuándo usar una cosa u otra; vendrá determinado por muchos factores.
2.- es necesario que entiendas perfectamente cómo funciona cada uno para poder determinar como digo en el punto uno cuándo deberás usar uno u otro.

Plantea una duda concreta y podremos aydarte a resolverla.

Echa un vistazo a esta pequeña guía (apartado 3.3.2.- Posición (la propiedad "position"), que quizá te pueda resultar útil.

Mikmoro · #10 (**permalink**) 13/02/2009, 19:43

Cita:

Iniciado por willyfc

pues si Mik la entendí para mí

Lo siento, pero había dicho:

Cita:

willyfc ha sido muy amable en su explicación, pero...

por lo que creía que estaba claro que no me dirigía a ti.

kisquain · #11 (**permalink**) 13/02/2009, 19:49

Muchas gracias a todos, me guardare el codigo willyfc, saludos!

willyfc · #12 (**permalink**) 13/02/2009, 19:53

que bueno que te sirva de algo, pero no te limites solo a eso, por ejemplo hay medidas fijas solo para mostrar como puede llegar a funcionar, es solo un ejemplo

y revisa el vínculo que Mik te paso, si eres novato eso te ayudará mucho

McPinkY18 · #13 (**permalink**) 15/02/2009, 00:41

y los diseños liquidos jeje o los estaticos? abro un tema nuevo..

Mikmoro · #14 (**permalink**) 15/02/2009, 05:53

Cita:

Iniciado por McPinkY18

y los diseños liquidos jeje o los estaticos? abro un tema nuevo..

Si quieres obtener la misma respuesta abre un tema nuevo con la misma pregunta (por lo genérica e indeterminable, quiero decir)

jomaruro · #15 (**permalink**) 15/02/2009, 06:24

Cita:

Iniciado por Mikmoro

Si quieres obtener la misma respuesta abre un tema nuevo con la misma pregunta (por lo genérica e indeterminable, quiero decir)

e inédita, añadiría yo.

Saludos.