CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

peachmelba Novice

11. juni 2013 - 00:25 Der er 13 kommentarer og
1 løsning

Centrering af menu

Hej med jer.

Det er lidt pinligt at jeg bliver nødt til at spørge om dette forholdsvis nemme spørgsmål, men indrømmet... Jeg er en klump til CSS

Jeg er ved at lægge sidste hånd på siden: http://lunderskov.dk

Siden er "flydende" hvilket bevirker, at når siden vises på en stor skærm, venstrestiller menuen i toppen sig.

Denne vil jeg gerne have centreret.

Jeg har via firebug forsøgt mig med

margin-left: auto;
margin-right: auto;

i elementet: .jp-mainmenu

Men kan ikke få det til at funke :-(

Er der hjælp at hente hos eksperterne ?

Synes godt om

mediman Nybegynder

11. juni 2013 - 07:24 #1

margin auto kræver en width,
prøv f.eks. med

width: 950px;
margin: 0px auto;

i stedet for margin-left og -right.

Synes godt om

peachmelba Novice

11. juni 2013 - 09:43 #2

Hej mediman.

Tak for sit svar.
Jeg kan stadig ikke få det til at funke.
Det jeg har er:

.jp-mainmenu {
border-bottom: 1px solid #F0F0F0;
float: left;
margin: 40px 0;
padding-bottom: 4px;
position: relative;
width: 100%;

Hvordan vil du mene det skal se ud for at virke?

Synes godt om

mediman Nybegynder

11. juni 2013 - 11:05 #3

.jp-mainmenu {
width: 950px;
margin: 0px auto;
padding-bottom: 4px;
border-bottom: 1px solid #F0F0F0;

Synes godt om

peachmelba Novice

11. juni 2013 - 11:14 #4

Det virkede - tak.

Men nu hoppede menuen helt op og lagde sig under stregen.

Se evt forskellen sammenlignet med:

http://test13.sidsteojeblik.dk/

Jeg gætter på at det har noget at gøre med:
margin: 40px 0

Men hvordan får jeg det flettet ind npr jeg allerede har en:
margin: 0px auto

Synes godt om

mediman Nybegynder

11. juni 2013 - 11:19 #5

.jp-mainmenu {
width: 950px;
margin: 0px auto;
margin-top: 40px;
padding-bottom: 4px;
border-bottom: 1px solid #F0F0F0;

Synes godt om

peachmelba Novice

11. juni 2013 - 11:43 #6

1000 Tak for hjælpen.

Vil du lægge et svar ?

Synes godt om

mediman Nybegynder

11. juni 2013 - 11:45 #7

Glad for at kunne hjælpe.

Synes godt om

peachmelba Novice

11. juni 2013 - 13:15 #8

Hej igen mediman.

Jeg håber jeg kan nå at fange dig selvom der er afgivet point.

Hvis du sammenligner:
http://lunderskov.dk
med
http://test13.sidsteojeblik.dk

er der en lille streg over menuen på lunderskov.dk
Denne streg skal ned til den blå streg (den menu side man befinder sig på.

Kan dette lade sig gøre?

Synes godt om

mediman Nybegynder

11. juni 2013 - 14:41 #9

Prøv med

.jp-mainmenu {
width: 950px;
margin: 0px auto;
margin-top: 40px;
margin-bottom: 40px;
padding-bottom: 4px;
border-bottom: 1px solid #F0F0F0;
}

Synes godt om

peachmelba Novice

11. juni 2013 - 16:05 #10

Desværre samme resultat.

Dit forslag er online lige nu på lunderskov.dk

Synes godt om

mediman Nybegynder

11. juni 2013 - 16:54 #11

hmmm ... prøv med

.jp-mainmenu {
width: 950px;
height: 40px;
margin: 0px auto;
margin-top: 40px;
margin-bottom: 40px;
padding-bottom: 4px;
border-bottom: 1px solid #F0F0F0;
}

Synes godt om

mediman Nybegynder

11. juni 2013 - 17:13 #12

Du skal nok også tilføje en

float: left;

så menulinien brydes, hvis browseren er smallere end de 950px.

Synes godt om

mediman Nybegynder

11. juni 2013 - 17:15 #13

Ups, disregard #12 - det er noget vrøvl.

Jeg har vist gang i for mange spørgsmål :-}

Synes godt om

peachmelba Novice

11. juni 2013 - 17:41 #14

Så er den i L (vinkel)

Endnu engang 1000 tak !

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML	2	30/10/202409:37	30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS