Hjelp med navigasjonsdel i design (HTML/CSS)

[meastp]

Trenger litt hjelp, jeg. Har jo postet et par ganger om designet mitt i webkaféen, og jeg plundrer litt med det, av og til. Forsøker nå å kode det, men jeg trenger hjelp med hvordan jeg skal lage den høyre siden / navigasjon. Jeg tenker på hvordan jeg skal få til de vertikale linjene, og "trapesene"... Alt med den, egentlig.

 

Problemene mine kommer når jeg skal ha trapesene helt inntil disse linjene. Jeg er usikker på hvordan jeg skal organisere divsene... Noen som kan gi meg et par hint/forslag?

Har lest litt om faux columns på alistapart, så tror ikke det er noe problem.

 

Forslag?

Endret 19. mai 2006 av meastp

[mikk-]

Del siden opp i to: en venstredel og en høyredel.

 

Menyene på høyresida er uordnede lister.

 

Overskriftene, med trapesene, er overskrifter, for eksempel h3 (h1 kan være "Bickering League" og h2 kan være "Navigasjon" e.l.). Trapesene setter du som bakgrunn i høyresidas h3.

 

Bruk fauxcoloumns for å få til bakgrunnen.

[Garreth]

For meg ser det ikke ut som du trenger noen diver der utenom en div som innholder alt på høyre siden. . Holder masse med h2 (eller kanskje h3) som overskrifter og ul for listepunktene. Blir mye mer oversiktlig i koden uten for mange diver.

 

Edit: Litt sen ja.

Endret 19. mai 2006 av Garreth

[meastp]

Mulig jeg var uklar. Jeg har en container-div, som er delt opp i to - én til innhold, og en til høyresiden. Jeg har listene, ordnede og uordnede i orden.

 

God idé med trapesene! Skal forsøke det. Takk!

 

Hva med de vertikale linjene helt til venstre i navigasjonsdiven (høyre)? Trapesene til navigasjonen? Hvordan kan jeg være sikker på at vertikale linjer og trapeser ligger helt inntil hverandre? bare "vanlig" float?

[Garreth]

Ja, bare tenk deg at de trapesene egentlig ikke er der, og at det er kun trapeser stylet på overskriftene, så når du har fått alle på samme y-akse så legger du til bakgrunnstrapesene. Skal fungere helt fint.

[meastp]

Ja, bare tenk deg at de trapesene egentlig ikke er der, og at det er kun trapeser stylet på overskriftene, så når du har fått alle på samme y-akse så legger du til bakgrunnstrapesene. Skal fungere helt fint.

6135303[/snapback]

Hm? Snakker du om trapesene til navigasjon nå? (de to øverste grønn og blå).

[Garreth]

Leste litt fort ja, men det fungerer på samme måte. Istedet for å bruke en div rundt hver meny, så bruker du bare <ul> på samme måte og styler den slik du vil.

[meastp]

Ah, smart... Det prøver jeg. Da mangler bare de vertikale linjene, da?

[Garreth]

jepp, og de fikser du ved å bruke metoden: fauxcolumns

[meastp]

Nei? Jeg fikser vel contents- og høyrediven med faux columns? De vertikale linjene er det verre med. Først en grønn som skal være på høyde med første navigasjonsliste, og en blå som skal gå helt ned. Det er hvordan jeg gjør det, jeg lurer på.

[Garreth]

Som "hovedbakgrunn" (faux columns) bruker du bare en 3-4 px høy del av siden som repeteres ned over. Denne er klippet ut av den delen av siden som bare innholder den blå fargen. Så bruker du overskrifter, ul-er osv som du har i høyre kolonnen med de forskjellige fargene, disse vil jo legge seg over det faux coumns bildet og det vil se helt likt ut som på designet ditt

Endret 19. mai 2006 av Garreth

[meastp]

Jeg skjønte ikke helt... Jeg snakker om de 3 stripene som markerer en fargeovergang mellom de to divene. Jeg bruker altså den blå versjonen hele veien, også overlapper jeg med den grønne øverst?

 

Jeg skjønner fortsatt ikke helt hvordan jeg skal få de til å stå helt inntil hverandre ved å bruke bakgrunn. Vil ikke teksten/resten bare overlappe bakgrunnen, siden det er bakgrunn?

[Even.]

Du bruker padding i css for å fa skriften til høyre for bakgrunnen.

[meastp]

Jo, men vil det fungere med dynamisk tekst(størrelse)? Da må jeg kanskje ha dynamiske bilder, også?

 

Eller bør jeg ikke ha navigasjonsdelen dynamisk, bare content?