Page 1 of 1

[56K WARN] boxes with css

Posted: Sat Feb 19, 2005 3:58 am
by mudkicker
Image

As you can see with a transparent red mark. i just want the left boxes (blog boxes don't slip below the information box. I just want them cover the information box... :roll:

Here is the css codes for the 2 types of boxes...

Code: Select all

div.blogbox {
background-color: #f6f6f6;
border: 1px solid #ededed;
margin-right: 5px;
margin-bottom: 8px;
position: relative;
}

#box {
	width: 200px;
	height: auto;
	float: right;
	clear: left;
	margin: 10px;
	font-size: 0.9em;
	background-color: #eee;
	border: 1px solid #ccc;
	padding: 5px;
	vertical-align: top;
	position: relative;
	z-index: 100;
}
Your help is really appreciated.. :wink:

Posted: Sat Feb 19, 2005 4:42 am
by n00b Saibot
set z-index for box to 0 and blog-box to 1,2,3,..100 whatever greater you wish ;)

Posted: Sat Feb 19, 2005 4:43 am
by timvw
don't really understand what you are trying to accomplish, but meaby some playing with the z-index ?

Posted: Sat Feb 19, 2005 4:47 am
by mudkicker
i want them like it's static there (info box) and the blog boxes left of it doesn't go to the right below this box..

Posted: Sat Feb 19, 2005 4:57 am
by n00b Saibot
have ya tried my method :?:

Posted: Sat Feb 19, 2005 5:06 am
by mudkicker
you misunderstood me. or i couldn't explain it :(

i don't want blog boxes on top of my info box. i just want them surround this info box.

i just drawn what i was thinking like this (well it's funny but i hopu you'll get my problem :D :D :D ) -->

Image

Posted: Sat Feb 19, 2005 5:13 am
by n00b Saibot
ok, now I gotcha :!: :) Nice Art you have here lol :lol:

welll mebbe use tables for this ;)
or rrrr.... set a different width for the overlapping blog boxes.

and tell me how any of this comes along.

Posted: Sat Feb 19, 2005 5:16 am
by mudkicker
i don't think tables can handle it, must be with css.. but how? because tables are more strict in positioning.. :(

Posted: Sat Feb 19, 2005 5:18 am
by n00b Saibot
set their width %ages according to content's width. It requires a little math here, baby. :wink:

Posted: Sat Feb 19, 2005 5:23 am
by mudkicker
well.. nope.. it's still the same... it doesn't do what i want to do..

Posted: Sat Feb 19, 2005 5:48 am
by n00b Saibot
well i can help you in arranging the way first blog-box is
but how d'you suppose to do the second blog-box trick - the way it is protruding below the info box thing

Posted: Sat Feb 19, 2005 5:51 am
by mudkicker
the second box must not protrude, it should stay left to it not over it...

Posted: Sat Feb 19, 2005 5:56 am
by n00b Saibot
then try my second suggestion .
set the width for first 2 blog-boxes to about 220px less than screen width because your info-box's width is 200px . So that should do the trick ;)

Posted: Sat Feb 19, 2005 6:00 am
by mudkicker
well all infos in all boxes come dynamically, this is not a good idea mate.. it can make problems :roll: it can be solved with css but how.. i saw many sites like this... but now i cant remember which they are.. :evil:

Posted: Sat Feb 19, 2005 6:05 am
by n00b Saibot
ok lets see. you want the blog-boxes in such way that they dont ovelap info-box right ?
next all your info loades dynamically into these boxes right ?
but the thing is, see the blog-boxes should never be greater than say about 600px to satisfy first condition.
So you can safely assume a maximum width of 600 px for your blog-boxes ;)