Witam, pomoże mi ktoś połączyć ze sobą elementy które stworzą menu ?
mam obrazki

obrazek jest górą menu

tło menu

tło na którym pojawia sie napis danego menu

dół menu, w kwadracie będzie umieszczony avatar.

pomógł by mi ktoś z napisaniem css dla tego oraz kodu html? : D

Oj, raczej nikt Ci nie pomoże. Jeśli chcesz żeby ktoś odwalił za Ciebie całą robotę (której nawet nie spróbowałeś zrobić), to załóż temat na giełdzie ofert jako "zlecenie".

no to chociaż podajcie mi jakiś przykład, stronkę gdzie jest jakiś poradnik do czegoś takiego, szukałem ale nigdzie nie ma, nie próbowałem ? mogę Ci wysłać z kilka mb plików które mi nie wyszły.

Mniej więcej możesz to zrobić tak : http://jsfiddle.net/UYzPg/2/
Ten odstęp między górnym obrazkiem, a resztą menu to pewnie jakiś prosty i durny błąd (bo pewnie coś źle zrobiłem), więc może ktoś podrzuci Ci jakieś proste rozwiązanie na jego poprawienie. Jak nie, to ustaw dla elementu "ul" margin-top:-4px i będzie działać (chociaż to nie jest poprawny sposób na naprawienie tego ).
Mniej więcej ogólną ideę powinieneś załapać. Zamiast img możesz bawić się w ustawienie background'u dla divów czy coś w ten deseń.

Edit:
display:block; dla elementu img rozwiązuje powyższy problem (wiedziałem że to jakieś proste rozwiązanie tylko musiałem poszukać )