CSS odległość tła div'a od krawędzi górnej i dolnej

[dulek09]

Witam serdecznie, postanowiłem zrobić własną templatkę i mam następujący problem, otóż chciałbym, aby tło w bloku menu było osadzone 37px od góry i 14 od dołu. Mam coś takiego:

<div class="module_menu">
<div>
<div>
<div>
<h3>Main Menu</h3>
ZAWARTOŚĆ MODUŁU MENU
</div>
</div>
</div>
</div>
CSS:

div.module_menu div {

}

div.module_menu div div div {
background: url(../images/blok_dol.png) no-repeat;
background-position: bottom;

}

div.module_menu {
background: url(../images/bg_blok.png) repeat-y;

}


h3 {
background: url(../images/h1_bg.png) 0 0 no-repeat;
height: 37px;
font-family: Verdana;
font-size: 12pt;
padding-top: 9px;
text-align: center;
padding-left: 10px;
color: #b8bfaa;

}
podgląd: www.preria.pl/new_page/ (http://www.preria.pl/new_page/)

[Robster]

Skoro już podałeś link do strony i napisałeś co byś chciał, możesz zadać pytanie.

[dulek09]

otóż chciałbym, aby tło w bloku menu było osadzone 37px od góry i 14 od dołu Napisałem wyraźnie :)

[Robster]

A ja nadal pytam co chcesz osiągnąć. Masz 3 pliki tła i ja mam sobie wybrać, które wypozycjonować, tak?

Elementy pozycjonujesz właściwościami margin i padding.

[zwiastun]

@Robster: eeeee,tam - a własności typu position, left, right, top, bottom, i parę innych...
@dulek: we własności background-image możesz okreslić parametry: left top, right bottom itd albo za pomocą tych dwu cyferek na końcu jedna 0<-left ->100% right, druga 0<-top ->100% bottom
(oczywiście albo cyferki, wtedy precyzyjnie, mogą być także piksele, albo słowa kluczowe i wtedy left, right, center)

[dulek09]

Robster: chodzi mi o obrazek http://preria.pl/new_page/templates/rhuk_milkyway/images/bg_blok.png

[dulek09]

Trochę to uporządkowałem, jednakże dalej nie wiem jak to poukładać, za każdym razem wychodzą mi dziwne rzeczy.



div.module_menu {
position: relative;
z-index:200;

}

div.module_menu div {
background: url(../images/h1_bg.png) 0 0 no-repeat;
width: 211px;


}



div.module_menu div div {
background: url(../images/bg_blok.png) repeat-y;
z-index:200;

}

div.module_menu div div div {
background: url(../images/blok_dol.png) no-repeat;
background-position: bottom;
width: 211px;
z-index:200;


}


h3 {

font-family: Verdana;
font-size: 12pt;
padding-top: 9px;
text-align: center;
padding-left: 10px;
color: #b8bfaa;
}

[zwiastun]

Co "poukładałeś"? Przecież nadal nie określiłeś pozycji obrazków (poza jedną informacją)!

[dulek09]

Zwyczajnie nie wiem jak to zrobić. Ani margin, ani padding ani nic nie działa albo nie działa tak jak trzeba.

[zwiastun]

Bo nie margin i nie padding służą do pozycjonowania tła! Napisałem Ci to wczoraj o godzinie 10:18! Wybacz, ale albo czytasz ze zrozumieniem, albo olewasz!

[dulek09]

Próbowałem tego już, wczoraj.


div.module_menu div div div {
background: url(../images/bg_blok.png) 0px 37px repeat-y;


ale nie działa
tzn. odległość w poziomie od lewej krawędzi bez problemu, ale od góry niestety nie

[zwiastun]

a to ciekawe, że od jednej krawędzi działa, a od innej nie działa. Uwierz działa na pewno.

[dulek09]

http://img202.imageshack.us/i/cs1lp.png/ <=== SCREEN

CSS:

div.module_menu div div div {
background: url(../images/bg_blok.png) 50px 37px repeat-y;

}



Jednej działa, drugiej nie :)

[dulek09]

ROZWIĄZANIE (prawie):

Zmieniłem w kodzie Joomli sposób wyświetlania modułów.



Pozdrawiam