+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: [CSS] 'boczki' po najechaniu w menu (/thread-css-boczki-po-najechaniu-w-menu)
Strony:
1
2
[CSS] 'boczki' po najechaniu w menu - menfis - 11-01-2012
RE: [CSS] 'boczki' po najechaniu w menu - n0xx - 11-01-2012
spakuj mi to menu w paczkę i wyślij na jakiś serwer - ogarnę ci to
RE: [CSS] 'boczki' po najechaniu w menu - Kartofelek - 11-01-2012
Podstawowa technika w cięciu: position:relative + position:absolute + left + right
LI : position:relative;
Jeden bok to span position:absolute + left:0; top:0 + reszta stylowania
Drugi bok to span position:absolute + right:0; top:0 + reszta stylowania
Równie dobrze możesz:
li:before {.....}
li:after {....}
ale tego starsze IE nie łykną.
RE: [CSS] 'boczki' po najechaniu w menu - n0xx - 12-01-2012
przecież to co podałeś jest bez sensu, jemu chodzi o spacery pomiędzy menu a nie lewy i prawy kraniec menu.
Wiem jak to zrobić ale nie chce mi się specjalnie menu robić żeby mu css'a podać.
RE: [CSS] 'boczki' po najechaniu w menu - menfis - 12-01-2012
"ale nie mozna tak zrobic wlasnie o to chodzi
bo tłem musi byc to co jest teraz
a nie mozna dawac 2 teł do jednego diva"
Tak mi powiedział mój magik. Chce mu pomóc, bo menu zupełnie inaczej wygląda z tymi 'boczkami', jednak póki co chyba nie da kodu, bo to spory projekt za który ma dostać wynagrodzenie
Dzięki wam za szybką odpowiedź, której nie dostałem na innym forum, mimo setek wyświetleń. n0xxie jeżeli masz gdzieś kawałek kodu który by udowodnił, że jest to wykonalne byłbym baardzo wdzięczny.
pozdrawiam
menfis
RE: [CSS] 'boczki' po najechaniu w menu - n0xx - 12-01-2012
twojemu koderowi przydała by się odrobina kreatywności i trochę nauki
trzymaj
http://www.speedyshare.com/file/a9VtS/menfis.rar
RE: [CSS] 'boczki' po najechaniu w menu - menfis - 12-01-2012
Wielkie dzięki, dam jutro znać jak to wyszło. Oczywiście + reputacja za pomoc. Myślę, że chociaż w ten sposób mogę podziękować. Koder jest na prawde wporządku i zna się na rzeczy.
@Edit Mam kilka wątpliwości
1. u ciebie tło najechanego fragmentu jest jakby z 2 fragmentów - lewy (długi) hover.jpg i prawy cien_r.jpg
Kod:
}
ul li a:hover{
background:url(hover.jpg) left top no-repeat;
}
ul li:hover {
background:url(cien_r.jpg) right top no-repeat;
padding-right:7px;mozna zrobic tak aby byl po lewej stronie cien_l, na srodku bg_najechany jak z mojego obrazka, który się 'kopiuje' oraz po prawej stronie cien_r?
Troche przerobiłem kod
Kod:
<style type="text/css">
ul {
margin:0;
padding:0;
list-style:none;
height:73px;
}
ul li {
display:block;
float:left;
height:73px;
}
ul li a {
display:block;
background:url(menu.jpg) left top repeat-x;
height:43px;
color:#FFF;
text-decoration:none;
padding:33px 20px 0 20px;
}
ul li a:hover{
background:url(cien_l.jpg) left top no-repeat;
}
ul li a:hover {
background:url(wyp.jpg) 10 center reapeat-x;
}
ul li:hover {
background:url(cien_r.jpg) right top no-repeat;
padding-right:7px;
}
ul li:hover a {
padding-right:13px;
}
</style>
</head>RE: [CSS] 'boczki' po najechaniu w menu - Kartofelek - 12-01-2012
n0xx:
"przecież to co podałeś jest bez sensu, jemu chodzi o spacery pomiędzy menu a nie lewy i prawy kraniec menu."
Przeczytaj jeszcze raz mój post ze zrozumieniem i wtedy komentuj. Proszę o rozwagę
Dla nie zorientowanych: 2 linijka mojego kodu. Position:relative spowoduje że boki ustawią się po bokach LI a nie listy.
I jeżeli twoje rozwiązanie działa w tym konkretnym przypadku, moje często uratuje ci tyłek. Zaręczam cię o tym
RE: [CSS] 'boczki' po najechaniu w menu - n0xx - 12-01-2012
ale nadal nie wiem jak chcesz rozwiązać opcję z cieniem w Twoim przypadku Kartofelek.
Chcesz wrzucac divy albo spany do li ?
menfis inaczej tego nie zrobisz, chyba, że chcesz wrzucać divy albo span do menu, jak nie chcesz to to co podalem jest jedynym rozwiazaniem
"mozna zrobic tak aby byl po lewej stronie cien_l, na srodku bg_najechany jak z mojego obrazka, który się 'kopiuje' oraz po prawej stronie cien_r?"
Tak można wciskając divy albo spany do li, ale to takie mało eleganckie
RE: [CSS] 'boczki' po najechaniu w menu - Kartofelek - 12-01-2012
li:before {.....}
li:after {....}
rozumiesz już?
LI {position:relative;}
LI:before {content:''; width:....px; height:...px; display:block; background:url(lewy_cien.png) no-repeat; position:Absolute; top:0; left:0;}
itp.