Avatar billede dennism Nybegynder
23. august 2010 - 00:47 Der er 3 kommentarer og
1 løsning

Problem med position absolute

Jeg har lavet dette eksempel:
http://uploads.dennismadsen.com/position.html

Jeg har tre bokse, som indeholder noget data. Indholdet i disse bokse bliver genereret af et CMS, så jeg ved ikke, hvor høje de bliver. Da jeg skal have en afstand mellem boksene på 40px, har jeg sat en margin-left. Da denne så kommer til at gælde for alle mine bokse og da der kun skal være denne afstand mellem dem, bliver der 40px i overskud, da det ikke skal være på den første. For at kompencere for dette, har jeg laves position:absolute på main-divet, og sat left:-40, for at få det til at passe med bredden.

Eneste problem er, at når min main-div bliver absolute, så optager den jo ikke længere plads - og derfor bliver footer-teksten i bunden ikke vist.

Hvordan kan jeg komme uden om dette?
Avatar billede -mundi- Nybegynder
23. august 2010 - 11:06 #1
Lav endnu en klasse som du sætter på det første div. I den sætter du margin-left: 0px !important;
Avatar billede kimdolleris Nybegynder
23. august 2010 - 19:43 #2
Enten det eller brug last-child pseudo klassen og vend din margin om til højre.

#main .box {
    float:left;
    width:200px;
    margin-right:40px;
    background-color:#e0e0e0
}
#main .box:last-child{
    margin-right:0px !important;
}

Garanterer ikke for ie6, men resten skulle det virke i..

=) Kim
Avatar billede dennism Nybegynder
25. august 2010 - 16:12 #3
Virker heller ikke i IE8, så må nok lave noget jQuery som fjerner margin i stedet.
Avatar billede kimdolleris Nybegynder
25. august 2010 - 17:47 #4
Hov, du har ret.. jQuery kan håndtere last-child;

// IE hack
    $(function(){
        $("#main .box:last-child").css("margin-right","0")
    })
Avatar billede Ny bruger Nybegynder

Din løsning...

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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester