Avatar billede filia Juniormester
03. januar 2011 - 21:04 Der er 2 kommentarer og
1 løsning

Horisontal centrering af Lytebox?

Er der nogen, der kan gennemskue, hvordan CSS- og js-filerne til en Lytebox skal ændres, for at få lyteboxen til at komme frem horisontalt midt på skærmen?
På http:/www.s tuxxx dio-b. dk (uden x og mellemrum) er der en Lytebox på de forskellige billedlinks, og den står i midten på en 19"-skærm, ligesom index-siden, der vha. CSS er tvunget til at stå i midten både horisontalt og vertikalt på alle skærme.

Jeg vil derfor gerne benytte den samme CSS til Lyteboxen, så den ikke hænger lidt foroven på større skærme, men i stedet sætter sig i midten, også horisontalt.
Men jeg kan ikke helt se hvordan, det skal gøres.
Jeg bruger denne CSS til horisontal og vertikal centrering:

#container { /*denne div centrerer siden både horisontalt og vertikalt*/
    height:555px; /*samme som sidens/tabellens højde*/
    width: 970px; /*samme som sidens/tabellens bredde*/
    position:absolute;
    top: 50%;
    left: 50%;
    margin-top: -277px; /*=det halve af height*/
    margin-left: -485px; /*=det halve af width*/
    text-align: left;
    background-color:#000;
    }

Den vil jeg også gerne bruge til Lyteboxen, men den synes ikke at have en div/container for hele indholdet (så vidt jeg kan se), og desuden styres den af javascripet, som jeg ikke er så dus med.

Kan det mon løses?
?:-)
Avatar billede claes57 Ekspert
03. januar 2011 - 21:14 #1
typisk - uden test, så kan du droppe
    position:absolute;
    top: 50%;
    left: 50%;
    margin-top: -277px; /*=det halve af height*/
    margin-left: -485px; /*=det halve af width*/
og bare køre med
margin:auto;
så skulle margin hhv top/bund og højre/venstre være ens.
Avatar billede filia Juniormester
24. januar 2011 - 21:56 #2
Tak for din kommentar. Det er ikke selve CSS´en til centrering, der er et problem, for den jeg har vist, fungerer fint. Men i dette tilfælde skal den gælde lyteboxen, som består af mange forskellige div´er, og desuden styres af et javascript.
Både CSS´en og javascriptet kan hentes via kilden på sitet.
Jeg har selv prøvet diverse ting, men jeg kan ikke knække nødden. Jeg tror, spørgsmålet er for uoverskueligt, så jeg lukker det.
/:-)
Avatar billede claes57 Ekspert
25. januar 2011 - 10:46 #3
ok
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
Kurser inden for grundlæggende programmering

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