Hola Camilo y a [EMAIL PROTECTED]:
He preparado un código que a lo mejor te puede ayudar. Va un poco en la
línea de lo que tu comentabas de poner un tag "inútil" delante del texto y
utilizar posicionamiento absoluto. Si te fijas también he añadido un id
#global para que funcione correctamente el posicionamiento absoluto con
diferentes anchos de pantalla.
Échale un vistazo y ojala que ayude.
************************************************
<head>
<style type="text/css">
<!--
#global{width:600px; position:relative }
#fotos {
position:absolute;
background:url(xxxxxxx.jpg) no-repeat top right;
height: 200px;
width: 100%;
top:20px;
right:20px;
z-index:3;
}
#contenido p span { float:right;
padding:100px;
height: 10px;
width: 10px;
border: 1px solid #000;}
-->
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum
dolor sit amet, consectetuer adipiscing elit...</p>
<div id="global">
<div id="contenido">
<p><span></span>Lorem ipsum dolor sit amet, consectetuer adipiscing elit...
Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum
dolor sit amet, consectetuer adipiscing elit... Lorem ipsum dolor sit amet,
consectetuer adipiscing elit... Lorem ipsum dolor sit amet, consectetuer
adipiscing elit... Lorem ipsum dolor sit amet, consectetuer adipiscing
elit... Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem
ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum dolor sit
amet, consectetuer adipiscing elit... Lorem ipsum dolor sit amet,
consectetuer adipiscing elit... Lorem ipsum dolor sit amet, consectetuer
adipiscing elit... Lorem ipsum dolor sit amet, consectetuer adipiscing
elit... Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem
ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum dolor sit
amet, consectetuer adipiscing elit... Lorem ipsum dolor sit amet,
consectetuer adipiscing elit... Lorem ipsum dolor sit amet, consectetuer
adipiscing elit... Lorem ipsum dolor sit amet, consectetuer adipiscing
elit... Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem
ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum dolor sit
amet, consectetuer adipiscing elit... Lorem ipsum dolor sit amet,
consectetuer adipiscing elit... Lorem ipsum dolor sit amet, consectetuer
adipiscing elit... Lorem ipsum dolor sit amet, consectetuer adipiscing
elit... Lorem ipsum dolor sit amet, consectetuer adipiscing elit... Lorem
ipsum dolor sit amet, consectetuer adipiscing elit... Lorem ipsum dolor sit
amet, consectetuer adipiscing elit... </p>
<div id="fotos">
</div>
</div>
</div>
</body>
*********************************************************
Un saludo
Alberto
From: Camilo Kawerín <[EMAIL PROTECTED]>
Reply-To: "Ovillo, la lista de CSS en castellano" <[email protected]>
To: "Ovillo, la lista de CSS en castellano" <[email protected]>
Subject: Re: [Ovillo] caja "flotada" a la derecha de un texto,pero
estructuralmente posterior
Date: Thu, 17 Nov 2005 20:35:37 -0300
Hola Marco y todos,
Marco Giacomuzzi escribió:
Camilo Kawerín:
Explico mi problema: quiero lograr una disposición como la que se puede
ver en: http://corrienteschamame.com/texto.jpg
Marco Giacomuzzi:
¿Y por qué no asignas "float: left" al marcador P?
Gracias por la respuesta, Marco, pero no funciona. Lo que pasa es que al no
tener el elemento <p> un ancho determinado, se ajusta al ancho del
contenedor y no deja que la caja #fotos con float: right aparezca arriba.
Si nadie tiene una pista de posible solución, creo que voy a optar por
darle posicionamiento absolute y agregar un <div></div> antes del texto
flotado a la derecha con las medidas apropiadas para que genere el espacio.
Saludos
--
Camilo Kawerín
27Sur comunicación & diseño
http://www.27sur.com
Recuerde *RESPONDER* a este mail, así puedo hacer un seguimiento de la
conversación.
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
