Forum Moderators: not2easy

Message Too Old, No Replies

CSS Positioning

         

AjAy2

10:46 am on Jan 30, 2006 (gmt 0)

10+ Year Member



Hi,

Does anyone know a way around having 'two' div tags next to each other in the center of the webpage?

I need a box of about 200px*200px in the center, and then another 200px*200px next to it.

I have been using relative tags for it, one div tags goes underneath the top one, but I have been using the 'minus- sign' to get it higher and align it next to the one I have.

Any information will be appreciated

SuzyUK

11:00 am on Jan 30, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi AjAy2 and Welcome to WebmasterWorld!

Q. is this related to this thread [webmasterworld.com] if so I'll join them together..

relative positioning [w3.org] will leave a space where the element would normally appear in the flow, it's how relative positioning works. :)


relative
The box's position is calculated according to the normal flow (this is called the position in normal flow). Then the box is offset relative to its normal position. When a box B is relatively positioned, the position of the following box is calculated as though B were not offset.

>>Your side by side question

You could use just negative margining without relative positioning to move elemnts slight up/left but in this case it sounds to me that you need to use float.. create a 400*200 wrapper div/box in the center then float the first 200*200 div/box left and the second one should slot in beside it, if IE causes you problems then make the wrapper box slightly wider than 400px

Suzy

AjAy2

11:06 am on Jan 30, 2006 (gmt 0)

10+ Year Member



Cheers Suzy,

The two were related but different questions and i didnt what to add to much to the first post and scare people away.

Thanks for the help, I will try that and get back to you if I have any problems, do I use relative positioning on both?

Thanks

Aarron

SuzyUK

12:36 pm on Jan 30, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



>>other post
cheers I'll leave the other one running thanks.. you shouldn't need any relative positioning for this one

if you center the wrapper as you have done with the first smaller box.. then you should not need any positioning (including center) on the inner two, side by side, divs except for floating the first one.

Suzy