Puedo aplicar tanto position: relative y float: left en un elemento? Como este:

div {
  float: left;
  position: relative;
  top: 0px;
  left: 0px;
}
InformationsquelleAutor Randy Mayer | 2010-04-14

5 Comentarios

  1. 43

    Sí.

    CSS2.1, 9.4.3:

    «Una vez que el cuadro se ha establecido de acuerdo con el flujo normal o flotando,
    puede ser desplazado con respecto a esta posición. Esto se llama posicionamiento relativo»

  2. 6

    Podría aplicar la posición relativa y flotar a la izquierda en uno de los elementos?

    Sí. Probarlo.

  3. 2

    Yo quiero darle una respuesta diferente en caso de que pueda ayudar a alguien. He tenido dos de lado a lado del div que yo quería que ellos ocupan espacio:

    <div class="col-md-12">
        <div class="col-md-6">stuff</div>
        <div class="col-md-6">other stuff</div>
    </div>

    Yo solía hacer esto mediante la aplicación de <div class="clear"></div> después de todo mi flotantes. Este se utiliza para trabajar porque .clear { clear: both; } podría resolver el problema. Esto ya no funciona para mí. En su lugar, he seguido estas instrucciones y agregó que esta clase para mi contenedor:

    .noFloat {
        width: 100%;
        overflow: auto; //If you get a scroll bar, try overflow: hidden;
        float: none;
    }

    así que terminé con:

    <div class="col-md-12 noFloat">...</div>

    Aquí hay un enlace a un bootply.com ejemplo: http://www.bootply.com/EupCHRhV4s

  4. 0

    Las respuestas que afirman que se puede combinar el flotador y la posición son realmente incorrecto. Sí, la posición de la div flotante de hecho va a mover, pero el texto que lo rodea no fluyen como se esperaba. El problema es que los atributos de posición efectiva de salir de un cuadro en blanco donde el div que usted está flotando solía ser, entonces mueve el div en otros lugares, salir de la caja. Dicho de otra manera, usted será el posicionamiento de su div en la parte superior del texto, cuando probablemente lo que quiero es que el texto fluya alrededor de la div en su nueva posición.

    He aquí un ejemplo de un div que tiene una simple float:right

    ¿Puedo combinar la posición relativa y float: left?

    He aquí un ejemplo de la misma div, pero con position:relative; y la parte superior:.75 pulg.; añadido:

    ¿Puedo combinar la posición relativa y float: left?

    Nota cómo el cuadro de ahora está sentado en la parte superior del texto. No creo que sea eso lo que usted desea!

  5. -1

    Sí, Usted puede utilizar ambos.

    Va a utilizar float:left a la posición del elemento a la izquierda y permitir siguiente elemento a la posición de lateral derecho de esta.

    position:relative afectarán a sí mismo y a sus hijos, a tomar posición. cuando usted va a utilizar left:npx;top:npx se moverá de este elemento a la izquierda,derecha,superior e inferior.

    Puede comprobar de esta demo: jsfiddle enlace

    • uno sólo por la votación de esta respuesta, pero no dijo lo que el mal es….

Dejar respuesta

Please enter your comment!
Please enter your name here