--- title: "overflow och position:absolute" type: "forum-thread" url: "https://www.webforum.nu/amne/html-css/171072-overflow-och-position-absolute" topic: "HTML & CSS" topic_url: "https://www.webforum.nu/amne/html-css" author: "Type" published: "2008-04-25T08:05:45.000Z" updated: "2008-05-04T08:11:16.000Z" replies: 16 views: 1215 page: 1 pages: 1 language: "sv-SE" site: "webForum — webforum.nu" rights: "Upphovsrätten till varje inlägg tillhör dess författare." attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/171072-overflow-och-position-absolute" --- # overflow och position:absolute ## #1 — Type, 2008-04-25T08:05Z Hej Jag vill ha scrollar på en div. Tyvärr måste jag (?) ha position:absolute eftersom den ska sitta fast längst ner i en annan div (mvh bottom:0). Kan man inte scrolla en sådan div med hjälp av overflow:auto? Permalänk: https://www.webforum.nu/p/171072 ## #2 — Type, 2008-04-25T08:17Z Nu har jag lyckats lösa det i FF. Använder max-height och sätter den till ett visst värde. Då funkar det prima i Firefox. Finns det någon motsvarighet för IE? Jag kollade men lyckades inte få till det med den. Permalänk: https://www.webforum.nu/p/2103254 ## #3 — Type, 2008-04-25T08:32Z Lite exempelkod som beskriver problemet: ``` TEST
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa. Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa. Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Maecenas tempus, urna hendrerit tristique eleifend, est urna auctor metus, feugiat rhoncus enim lectus at augue. Proin gravida feugiat orci. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa.Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia placerat. Suspendisse sed eros. luctus. Mauris in turpis. Aenean vehicula massa.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent mollis imperdiet massa. Donec faucibus nibh quis urna. Nam id elit in risus porta elementum. Maecenas tincidunt, velit eu ornare fringilla, nisl lorem fermentum massa, eget convallis urna felis vel turpis. Vivamus nec dui sed ante lacinia
``` Permalänk: https://www.webforum.nu/p/2103256 ## #4 — Type, 2008-04-25T08:40Z Jag måste lägga ner det här spammandet. Detta kirrade biffen. () ``` height: expression( this.scrollHeight > 600 ? "600px" : "auto" ); /* sets max-height for IE */ ``` Permalänk: https://www.webforum.nu/p/2103258 ## #5 — voigtann1, 2008-04-25T08:40Z IE har inte max-height eller min-height så du får använda dig av Height i IE. Antingen så kör du alltid på height:150px; eller så gör du ett IE hack för height i IE läsare. Permalänk: https://www.webforum.nu/p/2103259 ## #6 — Type, 2008-04-25T08:42Z > **voigtann1 skrev:** > > IE har inte max-height eller min-height så du får använda dig av Height i IE. Antingen så kör du alltid på height:150px; eller så gör du ett IE hack för height i IE läsare. Problemet är att höjden inte alltid ska vara en viss storlek. Jag vill helst ha en min-height och en max-height, annars ska höjden variera med innehållet. Men du har nog rätt i att man får köra på specialhack för IE. Hur reagerar andra webbläsare? Känns lite risky att fulkoda hela tiden :D Permalänk: https://www.webforum.nu/p/2103260 ## #7 — voigtann1, 2008-04-25T08:46Z ``` ``` lägg all IE specifik CSS i den filen så är det absolut inga problem med specifika IE fixar. Permalänk: https://www.webforum.nu/p/2103261 ## #8 — Type, 2008-04-25T08:48Z > **voigtann1 skrev:** > > ``` > > ``` > > lägg all IE specifik CSS i den filen så är det absolut inga problem med specifika IE fixar. Om jag lägger den under min vanliga css kommer den skriva över de andra då? Eller måste jag köra någon if-else-variant? Permalänk: https://www.webforum.nu/p/2103262 ## #9 — voigtann1, 2008-04-25T08:53Z Den kommer skriva över på de saker du har ändrat på. kod: ``` ``` Exemeplvis: I din vanliga css(design.css) så har du en klass som heter .box: ``` .box { color:#f00; height:100px; width: 100px; } ``` och i din ie.css: ``` .box { color: #0f0; width: 200px; } ``` I IE kommer boxen ha: - En grön text - En bredd på 200px - En höjd på 100px mmedans i de andra läsarna har du: - En röd text - En bredd på 100px - En höjd på 100px Permalänk: https://www.webforum.nu/p/2103263 ## #10 — Type, 2008-04-25T08:54Z tack Voigtann1! Det där var tokpedagogiskt. Nu ska IE få smisk! :birp Hur funkar det egentligen i IE7? Jag ser ingen skillnad alls när jag försöker ändra. Permalänk: https://www.webforum.nu/p/2103264 ## #11 — voigtann1, 2008-04-25T09:08Z IE7 har lite andra "fel" än ie6... men du kan skriva: ``` ``` beskriver hur du kan använda dig för olika versioner av IE. Permalänk: https://www.webforum.nu/p/2103267 ## #12 — Type, 2008-04-26T20:59Z Finns det någon liknande kod för Safari? Tydligen visar inte Safari punktlistor som de ska heller. Inte bara IE som krånglar... Eller ska o ska förresten, jag vet inte om FF och Opera visar rätt men jag skulle tro det ;) Permalänk: https://www.webforum.nu/p/2103412 ## #13 — voigtann1, 2008-04-26T21:19Z vad är fel i Safari? Permalänk: https://www.webforum.nu/p/2103414 ## #14 — Type, 2008-04-26T21:21Z Safari visar inte listpunkter när man använder float:left (dvs vill ha en horisontell lista) ```
  • test
  • test
  • test
  • test
``` Permalänk: https://www.webforum.nu/p/2103415 ## #15 — voigtann1, 2008-04-27T08:00Z list-style-type:disc; skall vara på ul Permalänk: https://www.webforum.nu/p/2103429 ## #16 — Type, 2008-04-27T08:13Z > **voigtann1 skrev:** > > list-style-type:disc; skall vara på ul Ingen skillnad i Safari. :( Permalänk: https://www.webforum.nu/p/2103430 ## #17 — Type, 2008-05-04T08:11Z Nu är det brådis. Jag har ett jätteproblem jag verkligen måste lösa. Det gäller IE som vanligt. Jag är med på att max-height inte funkar i IE. Därför måste jag använda height. Men om jag gör det blir höjden alltid det jag sätter den till. Jag vill ha samma funktion som max-height. Jag tycker inte koden jag skrev ovan funkar särskillt bra. Finns det något enkelt sätt? Det verkar som ``` height: expression( this.scrollHeight > 600 ? "600px" : "auto" ); /* sets max-height for IE */ ``` funkar i alla fall... Permalänk: https://www.webforum.nu/p/2107824 --- Tråden på webben: https://www.webforum.nu/amne/html-css/171072-overflow-och-position-absolute