|
|
 | Problemer med postionering
Fra : Jumbo |
Dato : 13-12-05 22:31 |
|
Har lagt problemet på
http://www.fdp.dk/r/
Det var meningen, at top-left (det gule felt) og top-right (det grå
felt) skulle ligge inde i det grønne felt
Jeg ville gerne bruge position: absolute, men sådan at left, top er i
forhold til det det grønne felt.
Meningen er, at det gule felt skal være en menu, som ligger i venstre
side af det grønne felt, og det grå skal starte 10 px tilhøre for det
gule og fortsætte ud til højre kant af det grønne.
Mvh
| |
 Erik Ginnerskov (13-12-2005)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 13-12-05 22:50 |
| | |
Jumbo (13-12-2005)
| Kommentar
Fra : Jumbo |
Dato : 13-12-05 22:57 |
|
On Tue, 13 Dec 2005 22:50:14 +0100, "Erik Ginnerskov"
<erik@donotspammmeplease.invalid> wrote:
>Tilføj i css denne linje til div#side: position:relative;
>
>Så kan du styre det gule og det grå felt i forhold til placeringen af det
>grønne.
Super!
Jeg troede, at position:relative; bestemte, hvordan div#side skal
positioneres - men den styrer, hvordan indholdet i div#side
positioneres?
Mvh
| |
 Dennis Munding (13-12-2005)
| Kommentar
Fra : Dennis Munding |
Dato : 13-12-05 23:06 |
|
Hej Jumbo!
"Jumbo" <ngr@mail.dk> skrev i en meddelelse
news:0rgup1lgo7r40nle8ss99fmiqlatqp2bs5@4ax.com...
> On Tue, 13 Dec 2005 22:50:14 +0100, "Erik Ginnerskov"
> <erik@donotspammmeplease.invalid> wrote:
>
>>Tilføj i css denne linje til div#side: position:relative;
>>
>>Så kan du styre det gule og det grå felt i forhold til placeringen af det
>>grønne.
>
> Super!
> Jeg troede, at position:relative; bestemte, hvordan div#side skal
> positioneres - men den styrer, hvordan indholdet i div#side
> positioneres?
En anden mulighed er at lave det med float:
http://www.skovaa-munding.dk/test.html
Med venlig hilsen
--
Dennis Munding
Web-master
http://www.skovaa-munding.dk/, http://www.mundings-memorial.dk/
http://www.cantica.dk/, http://www.eds-denmark.dk/
| |
Jumbo (13-12-2005)
| Kommentar
Fra : Jumbo |
Dato : 13-12-05 23:19 |
|
On Tue, 13 Dec 2005 23:06:01 +0100, "Dennis Munding"
<mail@invalid.com> wrote:
>Hej Jumbo!
>"Jumbo" <ngr@mail.dk> skrev i en meddelelse
>news:0rgup1lgo7r40nle8ss99fmiqlatqp2bs5@4ax.com...
>> On Tue, 13 Dec 2005 22:50:14 +0100, "Erik Ginnerskov"
>> <erik@donotspammmeplease.invalid> wrote:
>>
>>>Tilføj i css denne linje til div#side: position:relative;
>>>
>>>Så kan du styre det gule og det grå felt i forhold til placeringen af det
>>>grønne.
>>
>> Super!
>> Jeg troede, at position:relative; bestemte, hvordan div#side skal
>> positioneres - men den styrer, hvordan indholdet i div#side
>> positioneres?
>
>En anden mulighed er at lave det med float:
>
> http://www.skovaa-munding.dk/test.html
>
>
>Med venlig hilsen
Ja, men som jeg skriver i mit oprindelige spørgsmål, så vil jeg gerne
lave det med absolute.
Mvh
| |
Erik Ginnerskov (13-12-2005)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 13-12-05 23:20 |
|
Jumbo wrote:
> Jeg troede, at position:relative; bestemte, hvordan div#side skal
> positioneres
Det kan det også bruges til. Her er så den forskel i forhold til, hvis man
bruger 'absolute', at 'relative' ikke river elementet helt ud af sidens
flow.
Der er også den forskel, at 'absolute' positionerer i forhold til
placeringen af nærmeste overordnede elements placering på siden (her body),
mens 'relative' placerer i forhold til det sted, hvor elementet ville blive
placeret uden 'position:relative;':
<div style="position:relative;top:10px;left:25px;">Indhold, der er rykket 10
px ned og 25 px mod højre i forhold til hvor det ville stå uden
'position:relative'.</div>
> - men den styrer, hvordan indholdet i div#side
> positioneres?
Med 'position:relative' og uden hverken top- eller left-angivelse, sættes
bare et fixpunkt, som de indeholdte elementer kan positioneres i forhold
til.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/
| |
Jumbo (13-12-2005)
| Kommentar
Fra : Jumbo |
Dato : 13-12-05 23:38 |
|
On Tue, 13 Dec 2005 23:19:47 +0100, "Erik Ginnerskov"
<erik@donotspammmeplease.invalid> wrote:
>Jumbo wrote:
>
>> Jeg troede, at position:relative; bestemte, hvordan div#side skal
>> positioneres
>
>Det kan det også bruges til. Her er så den forskel i forhold til, hvis man
>bruger 'absolute', at 'relative' ikke river elementet helt ud af sidens
>flow.
>
>Der er også den forskel, at 'absolute' positionerer i forhold til
>placeringen af nærmeste overordnede elements placering på siden (her body),
>mens 'relative' placerer i forhold til det sted, hvor elementet ville blive
>placeret uden 'position:relative;':
>
><div style="position:relative;top:10px;left:25px;">Indhold, der er rykket 10
>px ned og 25 px mod højre i forhold til hvor det ville stå uden
>'position:relative'.</div>
>
>> - men den styrer, hvordan indholdet i div#side
>> positioneres?
>
>Med 'position:relative' og uden hverken top- eller left-angivelse, sættes
>bare et fixpunkt, som de indeholdte elementer kan positioneres i forhold
>til.
Skal vist lige sove inden jeg forstår det :
Men noget andet: Hvordan kan jeg sikre mig, at top-left og top-right
er lige høre - sådan at hvis jeg fylder mere tekst i den ene af dem,
så den forlænges, så forlænges den anden tilsvarende?
| |
Erik Ginnerskov (13-12-2005)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 13-12-05 23:42 |
|
Jumbo wrote:
> Men noget andet: Hvordan kan jeg sikre mig, at top-left og top-right
> er lige høre - sådan at hvis jeg fylder mere tekst i den ene af dem,
> så den forlænges, så forlænges den anden tilsvarende?
Det lyder som en opgave for javascript, hvis du vil aflæse højden på det
største element og tvangsindsætte samme højde på det mindste. Prøv at spørge
i clientside.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/
| |
Jumbo (14-12-2005)
| Kommentar
Fra : Jumbo |
Dato : 14-12-05 00:03 |
|
On Tue, 13 Dec 2005 23:42:18 +0100, "Erik Ginnerskov"
<erik@donotspammmeplease.invalid> wrote:
>Jumbo wrote:
>
>> Men noget andet: Hvordan kan jeg sikre mig, at top-left og top-right
>> er lige høre - sådan at hvis jeg fylder mere tekst i den ene af dem,
>> så den forlænges, så forlænges den anden tilsvarende?
>
>Det lyder som en opgave for javascript, hvis du vil aflæse højden på det
>største element og tvangsindsætte samme højde på det mindste. Prøv at spørge
>i clientside.
Det lyder ikke rart - ville helst undgå JS.
Men det var nu egenlig også div#side, der skulle være mindst lige så
kang som den længste af de to. Er det enklere?
Mvh
| |
Erik Ginnerskov (14-12-2005)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 14-12-05 00:31 |
|
Jumbo wrote:
> Men det var nu egenlig også div#side, der skulle være mindst lige så
> kang som den længste af de to. Er det enklere?
Eftersom du nu har indsat det gule og det grå element med absolut position i
det grønne felt, kan de to felters indhold ikke påvirke det grønne felts
højde, jævnfør mit svar kl. 23:19 - absolut positionerede elementer 'fylder'
ikke noget, de er revet ud af sidens flow.
Vil du have mulighed for at lade gul og grå påvirke højden af grøn, skal du
i stedet indsætte gul og grå med float.
http://hjemmesideskolen.dk/html/float.asp?id=flbillede
I så fald behøver du heller ikke den relative position på grøn.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/
| |
Jumbo (14-12-2005)
| Kommentar
Fra : Jumbo |
Dato : 14-12-05 13:34 |
|
On Tue, 13 Dec 2005 23:19:47 +0100, "Erik Ginnerskov"
<erik@donotspammmeplease.invalid> wrote:
>Jumbo wrote:
>
>> Jeg troede, at position:relative; bestemte, hvordan div#side skal
>> positioneres
>
>Det kan det også bruges til. Her er så den forskel i forhold til, hvis man
>bruger 'absolute', at 'relative' ikke river elementet helt ud af sidens
>flow.
>
>Der er også den forskel, at 'absolute' positionerer i forhold til
>placeringen af nærmeste overordnede elements placering på siden (her body),
>mens 'relative' placerer i forhold til det sted, hvor elementet ville blive
>placeret uden 'position:relative;':
>
><div style="position:relative;top:10px;left:25px;">Indhold, der er rykket 10
>px ned og 25 px mod højre i forhold til hvor det ville stå uden
>'position:relative'.</div>
>
Men med relative går det da helt galt: http://www.fdp.dk/r/
Nu forsvinder top-left helt, og menu lægger sig der, hvor top-left
burde være??
| |
|
|