homepage Welcome to WebmasterWorld Guest from 54.226.252.142
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Text around block (css)
Css and text block
jakomo




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

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

 

mep00




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

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.

jakomo




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

Thanks very MUCH! Its run :)

Best regards,
Jakomo

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved