Avatar billede htx98i17 Professor
04. maj 2016 - 20:14 Der er 2 kommentarer og
1 løsning

vertical-align

Jeg er godt nok blevet rusten i det her, det er ikke ligesom at cykle....

Jeg kan ikke få OVERSKRIFT til at være horisontalt centreret. Kan nogen hjælpe med det?


#topsort {
    position                    : relative;
    width                            : 100%;
    height                        :    100px;
    background-color    :    #780000;

}


.site_overskrift {
   
    font-size                    : 25pt;
    color                            : #FFFFFF;
    text-align                : center;
    vertical-align        :    middle;
    font-family                : arial;
    text-shadow                : 3px 3px #111;
}


<div id="topsort" class="site_overskrift" >OVERSKRIFT</div>
Avatar billede bpb Seniormester
04. maj 2016 - 22:33 #1
Horisontalt?  Mener du ikke vertikalt?  Horisontal centrering plejer ikke at give problemer.

Vertikal centrering af tekst i et div element er lidt kringlet, fordi vertical-align: middle ikke er understøttet.

Der findes forskellige metoder.  Her er en oversigt over nogle af dem:

http://vanseodesign.com/css/vertical-centering/

Jeg bruger selv den såkaldte CSS Table Method.  To div elementer inden i hinanden, display: table yderst, display: table-cell inderst.

Så virker vertical-align: middle som den skal.

Hvis centreringen skal være meget nøjagtig, kan der dog være brug for en pixel eller to som padding eller margin hist og her.
Avatar billede htx98i17 Professor
05. maj 2016 - 06:35 #2
Jeg brugte line-height løsningen

tak for det, jeg gemmer linket til andre situationer

lig et svar
Avatar billede bpb Seniormester
05. maj 2016 - 07:43 #3
Fint nok at du fandt en løsning.  Her er et svar.
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