[Webteam] Re: CSS question for www.squeak.org

[karl]

Jason Rogers skrev:
> Karl you can do it by wrapping the menu and news divs in another div
> that is absolutely positioned, then you make the menu and news divs
> relative and the 'margin-top: 20px' will work.
>
> So you end up with something like in the attached file.
>
> On 1/12/06, karl <karl.ramberg at chello.se> wrote:
>   
>> Sylvain pralon skrev:
>>     
>>> Hi
>>>
>>> I am a newbie in smalltalk but I have a good experience in CSS !
>>> Your problem is a classic one. The problem comes from the fact your
>>> positions are absolute.
>>> So if the menu div changes the news div don't care !
>>>
>>> Solution :
>>> * position : relative for the both div
>>> * for the news div -> margin-top : 20px;
>>>
>>> try this, I think it will work, if not tell me !
>>>
>>> sylvain
>>>       
>> Thanks. The whole page is designed using absolute positioning, so it seems
>> the style script needs a overhaul...
>> Karl
>>     
>>>> I'm thinking of adding a small News box on www.squeak.org but I can't
>>>> figure
>>>> out a CSS issue. I have a menu wich is defined like this:
>>>>
>>>> #menu {
>>>>  position:absolute;
>>>>  top: 75px;
>>>>  left: 10px;
>>>>  width:110px;
>>>>  padding:10px;
>>>>  background-color:#eee;
>>>>  border:1px dashed #999;
>>>>  line-height:17px;
>>>> }
>>>>
>>>> Below that menu box I would like to display the news box but the menu
>>>> box changes in height.
>>>> How do I tell the news box to position it self about 20 pixels below
>>>> the bottom of the menu box ?
>>>>
>>>> #news {
>>>>  position:absolute;
>>>>  top: ?????; menu bottom + 20 px
>>>>  left: 10px;
>>>>  width:110px;
>>>>  padding:10px;
>>>>  background-color:#eee;
>>>>  border:1px dashed #999;
>>>>  line-height:17px;
>>>> }
>>>>
>>>> Karl
>>>>
>>>>
>>>>
>>>>         
>>>
>>>
>>>       
>>
>>
>>     
>
>
> --
> Jason Rogers
>
> "I am crucified with Christ: nevertheless I live; yet not I,
> but Christ liveth in me: and the life which I now live in
> the flesh I live by the faith of the Son of God, who loved
> me, and gave himself for me."
>     Galatians 2:20
>   
> ------------------------------------------------------------------------
>
> ------- absolute div -------
> |                          |
> |   ------ menu ------     |
> |   |                |     |
> |   |      ....      |     |
> |   |                |     |
> |   ------ menu ------     |
> |                          |
> |         (20px)           |
> |                          |
> |   ------ news ------     |
> |   |                |     |
> |   |      ....      |     |
> |   |                |     |
> |   ------ news ------     |
> |                          |
> ------- absolute div -------
>
> <div class='absolutePositionedClass'>
>     <div class='menu'>
>     </div>
>     <div class='news'>
>     </div>
> </div>
>   
Thanks.
How do I write this in the stylescript ?
And set it up in smallwiki ???
Karl
> ------------------------------------------------------------------------
>
> _______________________________________________
> Webteam mailing list
> Webteam at lists.squeakfoundation.org
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/webteam
>