Hi group!

I have 3 div's, below each other. I want them to be centered. I have a
stylesheet with selectors:

#div1{
}

#div2{
}

#div3{
}

The most obvious way is to set the position of div nr 2 and 3 and set
those properties:

#div2{
left=xxxpx;
}

#div3{
left=xxxpx;
}

Then it occured to me:
Couldn't i tell div2 and 3 to calculate their width and position
relative to div1?
So like: "My left position must be equal to the other one's left
position PLUS half of it's width MINUS half of my width"

Then I get css like :
(pseudocode)

#div2{
/*position of my left border==position of previous div left border
+half of previous div's width- half of my width*/
left=div#div1[left] + div#div1[width]/2 - div#div2[width]/2
}

#div3{
/*position of my left border==position of previous div left border
+half of previous div's width- half of my width*/
left=div#div2[left] + div#div2[width]/2 - div#div3[width]/2
}

So that if I change the left OR the width of div1 the positions of all
dependant div's (div2 and div3) are changed accordingly...

Can this be done in css or should this be done in Javascript?

Thanks I A

--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS" 
at Google groups.
To post: [email protected]
To unsubscribe: [EMAIL PROTECTED]
-~----------~----~----~----~------~----~------~--~---

Reply via email to