CSS: Hvordan "nulle ut" effekten av en ekstra div vertikalt

[tom waits for alice]

Tenk dere en side der dere har en eller to menynivåer og en main under hverrandre i content. Nav 1 er satt til en større høyde enn den trenger.

 

Altså enten:

----------------

Nav1

 

Main

----------------

Eller:

----------------

Nav1

 

Nav2

Main

----------------

For brukeren vil Main tilsynlatende bevege seg opp og ned avhengig av om det er en Meny 2. Nå er det som sagt plass under Nav1, så jeg kan flytte Nav2 oppover ved å sette den position:relative og sette f. eks. top: -80px.

 

Men det flytter bare Nav2 relativt til den opprinnelige posisjonen. Main havner fortsatt der den vill om jeg ikke hadde flyttet Nav2. Altså får jeg:

----------------

Nav1

Nav2

 

Main

----------------

Mens det jeg ønsker meg som resultat er:

----------------

Nav1

Nav2

Main

----------------

Er det noen måte jeg kan fikse slike situasjoner på i CSS? Jeg har ingen indikator i content eller andre div'er på om det er en eller to menynivåer, og jeg ønsker å unngå absolutt posisjonering av main, fordi det kommer flere elementer nedenfor og flytende til høyre for content.

 

Geir

[funkyboy]

Er det noen måte jeg kan fikse slike situasjoner på i CSS? Jeg har ingen indikator i content eller andre div'er på om det er en eller to menynivåer, og jeg ønsker å unngå absolutt posisjonering av main, fordi det kommer flere elementer nedenfor og flytende til høyre for content.

 

Slik jeg har forstått problemstillingen, ser det ikke ut til at du kan gjøre dette i css (dersom du ikke ønsker å benytte absolutt posisjonering). Benytter du absolutt posisjonering, kan du sette bottom: 0; og si innholdet skal være posisjonert fra bunn uavhengig om det er et eller to nivåer der.

 

Du kan jo alternativt sette klasse "firstlevel" eller "firstlevel_standalone" (eller lignende), alt ettersom det er flere levels av meny der. Ellers ville nok det mest nærliggende (både med tanke på tidsbesparelse og semantikk) være å gjøre dette i javascript/jQuery.

Endret 12. april 2010 av bardoien

[tom waits for alice]

Takk for svar. Jeg skal foreslå at det legges på en klasse man kan skille på.

 

Geir

[Bjonski]

lag en boks som ligger rundt nav1 og nav2, slik at den opptar nok høyde til å få plass til begge?

 

boks start

-nav1

-nav2

boks stopp

-main

Endret 14. april 2010 av Bjohansen