30. august 2005 - 18:06Der er
42 kommentarer og 2 løsninger
position af div
Jeg har en række div'er der udgør mit site. Mit spørgsmål går på, hvordan jeg får placeret dem rigtigt.
Det jeg skal have er, at den ene div overlapper en anden (som var det to lag). Det er heller ikke noget problem med en absoute position BORTSET fra, at den så ikke står samme sted altid, men afhængigt af, hvor bred skærmen er. Hvis jeg bruger en af de andre position-værdier placeres div'en med billedet uden for de andre div'er.
En anden ting er at jeg ikke kan få centreret min main-div andet end i IE.
Nej, for så var du nok også kommet så langt i tankerækken, at du havde indset, vi intet kan sige om, hvad det er, du gør forkert, når vi ikke aner, hvad du gør ;o)
Jeg bliver nok nødt til at se dokumentet, for der er flere ting, der afgør, hvad der skal stå ... og det er muligt, der skal rettes andre steder også. Har du f.eks. en DTD øverst i dit dokument - og i så fald hvilken? Den er nemlig afgørende for, om IE overhovedet forstår CSS :)
- og det er helt i orden, du ikke forklarede dig helt tydeligt. Det kan godt være svært at forklare sig, når man ikke er helt 'stiv i koderne'. Jeg drillede bare lidt i al venskabelighed ;o)
Jeg kan desværre ikke vise dig hele dokumentet, da det indeholder fortrolige oplysninger jeg først skal sortere fra.
Det eneste jeg er ude efter er, om det er muligt at lave en overlapning (flere lag) uden brug af position:absulute, da den som sagt ikke placere elementet i forhold til parent-element, men i forhold til browserens yderpunkter. Det andet spørgsmål er om det ikke er muligt at centrere en div i browseren i andre browserer end IE?
jeg har kigget diverse sites igennem og er ikke kommet frem til en løsning... Derfor jeg spørger her. Mit spørgsmål går ikke på hvordan man lærer css (det kan jeg sagtens i forvejen), men konkret:
Er det muligt at lave 2 div'er der i 2 lag overlapper hinanden og det øverste lag IKKE bliver placeret i forhold til browserens højreside, men evt i forhold til enten centrum af skærmen (da jeg også skal have centreret min div!???) eller en i forvejen eksisterende div?
Og præcis de to links er herostratisk berømte for meget alvorlige misforståelser omkring benyttelsen af css, rent bortset fra de mange faktuelle fejl ...
Tag dig ikke af picro. Han har det med at ryge for store totter af sin mormors hår - og efterfølgende gå på Eksperten og søge opmærksomhed. Distrikstspsykiatrien ville klart være et bedre forum :o|
nåh, men eftersom nogle af de dygtigste folk endnu ikke har kunne svare på mit spørgsmål, er det vel fordi det ikke kan lade sig gøre... Så må man jo bare ty til tabeller og images. øvøv. Er der ikke andre gode forslag? Det jeg har er en div (contentarea) med en border og ovenpå den border skal der ligge et billede (logo).
Lader den lige stå lidt endnu, hvis jeg skulle være så heldig at der skulle komme en forbi der havde løsningen.
Jeg er stadig ikke helt klar på, hvad det præcist er, du vil - men du kan jo f.eks. altid bruge en kombination af et relativt og et absolut positioneret element:
1. Jeg har en div navngivet contentArea. Forestil jer at det er det hvide område her på exp. Den div har en border ligesom den sorte her på exp (dette er egentlig irrelevant).
2. jeg har et logo-image lagt i en div navngivet logo. Forestil jer at det er exp's blå logo i øverste venstre hjørne (mit sidder så bare i højre).
Det jeg vil have er at logoet bliver flyttet så det ex. centrum af logoet er lige på hjørnet af contentArea. Dvs. at logoet både går ud i det blå område og ind i det vide.
Tricket er: Et absolut positioneret element placerer sig:
1. i forhold til det først omkransende positionerede element (relativt eller absolut er ligemeget). 2. Findes et sådan ikke, placerer det sig i forhold til body-elementet
- mange kender kun punkt 2 ... men punkt 1 er faktisk meget vigtigt ;o)
Kan du så også svare på hvordan jeg får centreret min wrapper (som er den der nu har fået en position relativ!) i forhold til body og så det virker i alle browserer? :P
Det kræver, du bruger en DTD aller øverst (linjen før <html>) med definitions-URL'en i. Det kunne f.eks. være: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- ellers er der enorme huller i IE's CSS-fortolkning :)
Dernæst sætter du margin-left og margin-right til auto på elementet, der skal centreres. Barberet helt ned:
Læg mærke til, dit wrapper-element skal have sat en bredde. Ellers fylder div'et jo hele bredden - og så giver det ingen mening at centrere elementet, horisontalt ;o)
joh, men du var jo hurtigst med centreringsspørgsmålet... Hvis vi nu laver en procentfordeling så alle er glade... Synes i begge skal have lidt, men klart ole skal have flest ;)
Utroligt at eksperten endnu ikke har lavet systemet så det er muligt at tildele flere point hvis man finder det rimeligt. <- ET FORSLAG TIL FORBEDRING ;)
Føler mig ellers gavmild og glad og ville ha' fordelt pointene 80-40. Det ville ha været mest rimeligt. :)
Endnu engang tak for hjælpen. og på genchat (eller hvad sådan noget nu hedder)
når jeg nu har fat i dig vil jeg da lige minde dig om at du endnu ikke har svaret på http://www.eksperten.dk/spm/611507. Vil du ikke besvare den så du kan få dine point og jeg kan få lukket spg. ;)
Har aldrig lagt mærke til det menupunkt der hed funktioner. Det beklager jeg ... Det burde du have point for at lære mig.. ;)
Jeg husker jer til en anden gang... så er der bonuspoint
ps. så et tip til forbedring.. Gør det muligt at den automatisk finder ud af at der er flere point på spil hvis man indtaster flere point end først angivet ved pointgivning.
olebole: 1. i forhold til det først omkransende positionerede element (relativt eller absolut er ligemeget). ...
Den første hvor du skriver, at det er ligemeget om man bruger relative, eller absolute, passer da ikke? :S
Hvis man nu tænker sig at man har en div på 500px i højde. Heri er placeret top andre divs der hver er 200 px høje (det hele selvfølgelig også med en bredde.. :P)..
Hvis man bruger position: absolute; så er vi enige om at den vil finde det hjørne man angiver, i den div den står i. Men hvis man bruger position: relative; så vil den da rette sig efter hvor den er placeret i koden. Altå en top: 15px; vil være det samme som at den hoppe 15px ned fra hvor den ellers ville have stået. Og ikke toppen af den div som den er placeret i.. :)
Det inderste div placerer sig i forhold til det yderste div, hvis det inderste er positioneret absolut og det yderste er positioneret absolut eller relativt.
Hvis du mener noget andet, så test. Får du et resultat, som ikke stemmer overens med, hvad jeg skriver, vil jeg meget gerne se koden :)
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.