[CSS][HTML]Menu jako DIV o podanym obramowaniu Opcje

[_chris_]

Witam ponownie
Jako że już uzyskałem dzisiaj idealną odpowiedź na moje jedno z pytań, proszę was o poradę. Mam w szablonie php-fusion (tabelka) zrobione panele w taki sposob:


Przerabiam szablon na joomle. Chciałbym aby menu widoczne po prawej i po lewej wlasnie tak wygladaly. Wiadomo ze moga miec różne długości i rozmiary. Posiadam obrazki każdego rogu i każdego boku czyli w sumie 8. Tu jest oryginał strony: http://chris.vot.pl Nie proszę koniecznie o rozwiązanie, ale chociaż o wskazanie właściwej drogi

Z góry dzięki!

Ten post edytował _chris_ 19.01.2012, 21:11:35

[Condictor]

Możesz zainstalować sobie wtyczkę Firebug do przeglądarki
i zobaczyć jakie style CSS zostały dodane na podanej przez
Ciebie stronie. Później wykorzystać z nich to co potrzebujesz.

W niektórych boksach masz za szerokie obrazki i Ci się rozjeżdżają.

Ten post edytował Condictor 19.01.2012, 23:29:27

[_chris_]

Wiem że się rozjeżdżają dlatego też chcę to poprawić teraz tak żeby było ok!

Firebuga mam zainstalowanego często korzystam, no jednak nie bardzio wiem jak przenieść tabelke na diva. Tam jest tabelka i powkładane tła. Przecież nie będę 9 divów zamieszczał

[Condictor]

Wiem że się rozjeżdżają dlatego też chcę to poprawić teraz tak żeby było ok!

Jak zmniejszysz obrazki, które masz w tych boksach to może przestana się rozjeżdżać?

[_chris_]

No nieważne. Tak czy inaczej przerabiam to na joomle. W sumie zrobiłem już tak że mam rogi i w środku treść. ale w joomli moduły dodają się jako np. ul class=.menu i jako class menu zrobilem cssa który wstawia 4 rogi. No ale nie mam jak teraz zrobić obramowania na bokach i góra dół;/

[zdemotywowany]

Ja tam widzę 3 div'y. Jeden z nagłówkiem, drugi z treścią, z trzeci 'ze stopką'.

[_chris_]

No ale jak zrobisz zmienną szerokość jeśli nagłówek będzie miał stały obraz?

rozwiązałem sprawę, może niezbyt profesjonalnie, ale działa i jest ok:)

najpierw wsadzam diva:

.border-menu{
background: url(../images/side.png) repeat-x left top, url(../images/sideb.png) bottom left repeat-x, url(../images/border-left.png) left top repeat-y, url(../images/border-right.png) right top repeat-y;
background-color: #EEEEEE;
height: 100%;
}

Obrazki w tym divie to sa powtarzalne krawędzie. Po tym divie wstawiam:
.menu-side{
background: url(../images/side-left.png) left top no-repeat, url(../images/side-right.png) right top no-repeat, url(../images/sideb-left.png) left bottom no-repeat, url(../images/sideb-right.png) right bottom no-repeat;
min-height:100px;
width: 100%;
height: 100%;
}

Tutaj obrazkami sa rogi. Działa, ładnie wygląda:) Tak samo rozwiązałem problem z artykułami. W tej chwili prawie już cała strona wygląda jak na oryginale http://chris.vot.pl

rozwiązałem sprawę, może niezbyt profesjonalnie, ale działa i jest ok:)

najpierw wsadzam diva:

.border-menu{
background: url(../images/side.png) repeat-x left top, url(../images/sideb.png) bottom left repeat-x, url(../images/border-left.png) left top repeat-y, url(../images/border-right.png) right top repeat-y;
background-color: #EEEEEE;
height: 100%;
}

Obrazki w tym divie to sa powtarzalne krawędzie. Po tym divie wstawiam:
.menu-side{
background: url(../images/side-left.png) left top no-repeat, url(../images/side-right.png) right top no-repeat, url(../images/sideb-left.png) left bottom no-repeat, url(../images/sideb-right.png) right bottom no-repeat;
min-height:100px;
width: 100%;
height: 100%;
}

Tutaj obrazkami sa rogi. Działa, ładnie wygląda:) Tak samo rozwiązałem problem z artykułami. W tej chwili prawie już cała strona wygląda jak na oryginale http://chris.vot.pl