css - Centrere menu-tekst (links) - Udvikleren.dk - Programmering, webdesign og grafik

Tags: css

<< < 1 2 > >>

Bruger #14791 @ 22.07.11 17:49

Hej UV´er.

Jeg har et lille problem med lidt CSS.

Jeg kan simpelthen ikke se hvad der sker, men den låser altså et sted så jeg ikke kan centrere teksten (linksne) i min menu.

css koden er her:

CSS kode

 ul.menu {
 list-style-type:none;
 width:100%;
 position:relative;
 display:block;
 height:30px;
 font-size:18px;
 background:url(../images/menu_bg.png) repeat-x top;
 font-family:Verdana,Helvetica,Arial,sans-serif;
 border:1px solid #000;
 margin:0;
 padding: 0px;
 }
 
 ul.menu li {
 display:block;
 float:left;
 margin:0px;
 padding:0px;
 
 }
 
 ul.menu li a {
 float:left;
 color:#A79787;
 text-decoration:none;
 padding:4px 20px;
 font-size:16px;
 
 }
 
 ul.menu li a:hover,.current {
 color:#fff;
 background:url(../images/menu_bg.png) repeat-x top left;
 }
 
 ul.menu .current a {
 color:#fff;
 font-weight:700;
 }
 
 ul.menu.green{
 background-color:#8B9559;
 }
 ul.menu.green li a:hover, .menu.green li.current {
 background-color:#BECD5E;
 }

Jeg har prøvet med text-align:center; osv alle mulige steder, men den vil simpelthen ikke centrere teksten.

Nogen der har en idé til hvor jeg kan sætte ind

15 svar postet i denne tråd vises herunder
7 indlæg har modtaget i alt 20 karma

Sorter efter stemmer Sorter efter dato

Bruger #10216 @ 22.07.11 20:13

4.283

Ah, så du vil centrere hele menuen og ikke kun teksten i de individuelle links. Den er lidt mere langhåret, og så vil jeg nok henvise dig til f.eks: http://pmob.co.uk/pob/centred-float.htm

Bruger #15747 @ 22.07.11 20:17

Ah, så du vil centrere hele menuen og ikke kun teksten i de individuelle links. Den er lidt mere langhåret, og så vil jeg nok henvise dig til f.eks: http://pmob.co.uk/pob/centred-float.htm

Hvorfor så ikke bare lave en ny div med margin:auto og en specifik bredde?

Bruger #14791 @ 22.07.11 22:41

David: det virker umiddelbart ikke

Michael: Jah, altså det skal kun være teksten der skal være centret, hele menuen, inkl baggrund har jo width på 100%, så den er som den er.
Men linksne (teksten) skal ikke stå i venstre side af skærmen, men i midten af skærmen.

Det kan godt være jeg skal bruge en div mere, jeg ved bare ikke helt hvor og hvordan den skal laves..

Bruger #14791 @ 22.07.11 23:48

Det virker ikke optimalt

Den rykker menuen ind i midten, men den sorte baggrund bliver kun 500px, og hvis man ændre den width til 100% så er man tilbage til udgangspunktet.

Den sorte baggrund skal være 100%, det er kun teksten der skal være i midten..

Bruger #14791 @ 23.07.11 12:06

Så virker det sku

TAK!

Det er godt lidt mærkeligt, men hey, det virker.

Jeg endte med at gøre følgende:

CSS kode

 .menu {
 margin:auto;
 width:604px;
 }
 
 .sortbaggrund {
 width:100%;
 background-image:url(../images/menu_bg.png);
 background-color:#8B9559;
 border:solid 1px #000000;
 }

Grunden til at jeg skal have Bg color på, er at den grønne streg er baggrundsfarven. Dvs, da jeg lavede den sorte baggrund i PS, gjorde jeg den der streg transparent.

Jeg måtte dog ændre ul.menu til height på 25px i stedet for 30px da der kom et gråt felt for neden.
Jeg går ud fra det skyldes at man tilføjer flere div, at den så laver lidt ekstra plads ?

Nå, men det virker hvert fald nu

Så tak for hjælpen!

<< < 1 2 > >>

Centrere menu-tekst (links)

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler