css hulp?

Hey,
ik zit nu met het probleem dat ik mijn menu bar een andere kleur wil geven, maar het probleem is dit is niet te doen via photoshop want het heeft met css te maken. der zit een overloop in.

de menu bar is te zien op _www._latiffany_.nl_ laagstreepjes zijn vanwege google search

code van de cssbestand ;

/* Ribbon
------------------------------------------------------------*/

.ribbon {
    position: relative;
}
.ribbon:before, .ribbon:after {
    content: "";
    position: absolute;
    display: block;
    bottom: -10px;
    border: 18px solid #5987BA;
    z-index: -1;
}
.ribbon:before {
    left: -23px;
    border-right-width: 15px;
    border-left-color: transparent;
}
.ribbon:after {
    right: -23px;
    border-left-width: 15px;
    border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #4F6174 transparent transparent transparent;
    bottom: -10px;
}
.ribbon .ribbon-content:before {
    left: 0;
    border-width: 10px 0 0 10px;
}
.ribbon .ribbon-content:after {
    right: 0;
    border-width: 10px 10px 0 0;
}

/* Menu
------------------------------------------------------------*/

#menu {
    height: 37px;
    margin-bottom: 10px;
    border-top: 1px solid #5D8EC4;
    border-bottom: 1px solid #5D8EC4;
    background: #69A0DD;
    background: -moz-linear-gradient(top, #69A0DD 50%, #6495CC 100%);
    background:    -webkit-gradient(linear, center top, center bottom, color-stop(50%, #69A0DD), color-stop(100%, #6495CC));
    -webkit-box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
       -moz-box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
            box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
}
#menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#menu > ul > li {
    position: relative;
    float: left;
    z-index: 20;
    padding: 6px 5px 0 0;
    border-right: 1px solid #5D8EC4;
    -webkit-box-shadow: 2px 0 0 -1px #78ADE8;
       -moz-box-shadow: 2px 0 0 -1px #78ADE8;
            box-shadow: 2px 0 0 -1px #78ADE8;
    -webkit-transition: background .2s;
       -moz-transition: background .2s;
            transition: background .2s;
}
#menu > ul > li:hover {
    background: #78ABE4;
    -webkit-box-shadow: 0 0 0 0 #78ADE8;
       -moz-box-shadow: 0 0 0 0 #78ADE8;
            box-shadow: 0 0 0 0 #78ADE8;
}
#menu > ul > li > a {
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    line-height: 14px;
    text-transform: uppercase;
    text-decoration: none;
    display: block;
    padding: 6px 10px 6px 10px;
    margin-bottom: 5px;
    z-index: 6;
    position: relative;
    -webkit-text-shadow: 0 1px 1px #3D5F83;
       -moz-text-shadow: 0 1px 1px #3D5F83;
            text-shadow: 0 1px 1px #3D5F83;
}
#menu > ul > li:hover > a {
}
#menu > ul > li > div {
    display: none;
    background: #78ABE4;
    position: absolute;
    z-index: 5;
    border-left: 1px solid #5D8EC4;
    border-right: 1px solid #5D8EC4;
    border-bottom: 1px solid #5D8EC4;
}
#menu > ul > li:hover > div {
    display: table;
}
#menu > ul > li > div > ul {
    display: table-cell;
}
#menu > ul > li ul + ul {
    padding-left: 20px;
}
#menu > ul > li ul > li > a {
    text-decoration: none;
    padding: 4px;
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    display: block;
    white-space: nowrap;
    min-width: 120px;
    -webkit-text-shadow: 0 1px 1px #3D5F83;
       -moz-text-shadow: 0 1px 1px #3D5F83;
            text-shadow: 0 1px 0 #5D8EC4;
    -webkit-transition: background .1s;
       -moz-transition: background .1s;
            transition: background .1s;
}
#menu > ul > li ul > li > a:hover {
    background: #5D8EC4;
}
#menu > ul > li > div > ul > li > a {
    color: #FFFFFF;
}

dit is niet het hele bestand maar volgens mij wel wwat je nodig hebt om de menu bar te veranderen van kleur.

Om te beginnen kan je al een leestekens gaan gebruiken in je bericht. Niemand heeft zin om 5 regels te lezen dat samen 1 zin vormt zonder hoofdletters of leestekens.

Zodra je dat gedaan hebt kom ik nog wel eens terug en kijk ik of ik je kan helpen.

zo beter henk?

#menu {
    height: 37px;
    margin-bottom: 10px;
    border-top: 1px solid #5D8EC4;
    border-bottom: 1px solid #5D8EC4;
    background: #69A0DD;
    background: -moz-linear-gradient(top, #69A0DD 50%, #6495CC 100%);
    background:    -webkit-gradient(linear, center top, center bottom, color-stop(50%, #69A0DD), color-stop(100%, #6495CC));
    -webkit-box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
       -moz-box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
            box-shadow: 0 8px 10px -8px #33506F,
                        inset 0 2px 0 -1px #78ADE8;
}

Je hebt een gradient in je menu van #33506F naar #78ADE8. Door overal die HEX kleurcodes aan te passen naar je nieuwe kleurcodes is de kleur van je menu gewijzigd.

Klik

toevoeging op 21 mei 2013, 1541:
Je wilt wss ook de hover van je menu wijzigen. Dat kan hier:

#menu > ul > li:hover {
    background: #78ABE4;
    -webkit-box-shadow: 0 0 0 0 #78ADE8;
       -moz-box-shadow: 0 0 0 0 #78ADE8;
            box-shadow: 0 0 0 0 #78ADE8;
}

toevoeging op 21 mei 2013, 1542:

.ribbon:before, .ribbon:after {
    content: "";
    position: absolute;
    display: block;
    bottom: -10px;
    border: 18px solid #5987BA;
    z-index: -1;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #4F6174 transparent transparent transparent;
    bottom: -10px;
}

Dat heb je ook nog, dat is de rand van je menu.

toevoeging op 21 mei 2013, 1507:
En je moet BTW geen lage streepjes in je URL doen, Webwereld is niet zichtbaar voor niet-ingelogde leden.

Antonn schreef:

En je moet BTW geen lage streepjes in je URL doen, Webwereld is niet zichtbaar voor niet-ingelogde leden.

En heeft btw geen nut, want je moet die streepjes tussen de websitenaam zetten en niet voor/achter de punten.

oke is niet erg maar tog bedankt.

@Antonn ik heb het geprobeerd nou is het me gelukt om de kleuren te veranderen maar ik doe iets niet goed ik krijg de mooie effect niet die je ziet bij het blauwe ..

ik wil graag een roze overloop hebben maar dit is echt lastig

Dan heb je dus 2 kleuren nodig. Een licht roze en een donker roze.

dat heb ik gedaan maar die streepjes in de midden en de effect luktme maar niet ik weet niet eens welke ik licht naar donker zou je me kunnen helpen evt tegen een vergoeding?

Hoe makkelijk is dit.. gewoon hashtags kleuren aanpassen.

Colingeert schreef:

Hoe makkelijk is dit.. gewoon hashtags kleuren aanpassen.

Hier komen we ook nergens mee...

haha dat dacht ik ook maar je moet de juiste overloop de juiste schaduw blabla de juiste omlijning en dan ga je in de war raken maar heb het na wat harde bikkelen opgelost!