Welcome to WebmasterWorld Guest from 54.205.115.177

Forum Moderators: not2easy

Message Too Old, No Replies

Text around block (css)

Css and text block

   
12:56 am on Feb 2, 2007 (gmt 0)

5+ Year Member



Hello Friends!

I'm going to be crazy with CSS, I was trying to do it, but I cannot, see the example.

I dont want to add ADS block into WRAP block, because the text of wrap block come from database.

I want to do something like this

<div id="wrap">
TEXT TEXT <------------ COME FROM DATABASE
<div>

<div id="ADS">
ADS
<div>

-------------------------------------
¦ TEXT TEXT TEXT TEXT TEXT text textd¦
¦ TEXT TEXT TEXT TEXT TEXT text textd¦
¦ TEXT TEXT TEXT TEXT TEXT text textd¦
¦ TEX TEXT TEXT TEXT TEXT text text d¦
¦ TEXT TEXT TEXT --------------------¦
¦ TEXT TEXT TEXT ¦sads ads ads ads dd¦
¦ TEXT TEXT TEXT ¦sADS ads ads ads ad¦
¦ TEXT TEXT TEXT ¦sads ads ads ads dd¦
¦ TEXT TEXT TEXT ¦ads ads ads asds ad¦
¦ TXT TEXT TEXT ---------------------¦
¦ TEXT TEXT TEXT TEXT TEXT TEXT TEXT¦
¦ TEXT TEXT TEXT TEXT TEXT TEXT TEXT¦
¦ TEXT TEXT TEST TEXT TEXT TEXT TEXT¦
¦-------------------------------------

Anyone have any example?
Thanks very much
Jakomo

4:49 am on Feb 2, 2007 (gmt 0)

10+ Year Member



After playing with it a bit I came up with:

#spacer {
float:right;
height :12em; /* adjustable */
width:0;
}
#ADS {
float: right;
clear:right;
width: 10em; /* adjustable */
margin-top:1em; /* corrects a bug(?) in Gecko and KHTML*/
}

<div id="spacer"></div>
<div id="ADS"></div>
<div id="wrap"></div>

The order of the divs is opposite of yours and there's an extra div. If that's exceptable, OK; if not, I don't think it can be done with CSS2.1. I tested it in Firefox 2.0.0.1, IE6, Opera 9.1, and Konqueror 3.5.6, so Safari should also work.

Also, I recommend using ems since line-height * # of ems = # of lines (usually). The bug I noted above seemed to be related to a rounding error in the calculation (a guess); it resulted in text overlapping the #ADS.

10:56 pm on Feb 2, 2007 (gmt 0)

5+ Year Member



Thanks very MUCH! Its run :)

Best regards,
Jakomo