| Autor | Zpráva | ||
|---|---|---|---|
| Radim Blaťák Profil |
#1 · Zasláno: 22. 11. 2012, 12:09:39
Mám udělané menu ve kterém mám danou svou odrážku. Když dám ale menu inline, ať se mi zobrazí na řádku, tak se mi odrážka nezobrazuje. Když display:inline zruším, tak tam odrážky jsou, ale menu je pod sebou.
div#h_menu {
position: absolute;
top: 140px;
right: 0px;
margin: 0px;
width: 600px;
padding: 0px;
}
#h_menu ul, #h_menu li {
list-style-image: URL('zg/odrazka.png');
display: inline;
margin: 0px;
padding: 0px;
} |
||
| jenikkozak Profil |
#2 · Zasláno: 22. 11. 2012, 12:41:52
Radim Blaťák:
Tu odrážku můžeš přidat jako obrázek na pozadí položky. |
||
| ALLSSA Profil |
#3 · Zasláno: 22. 11. 2012, 12:57:43
Radim Blaťák:
Pokud máš seznam jako inline prvek, tak se zobrazuje jako řádkový prvek a ten přeci odrážku nemá. Odrážka se bude zobrazovat pouze pokud bude display:list-item; (což je seznam defaultně). Pokud chceš mít seznam inline s obrázkem před textem, tak bych zvolil toto: //css kód
#h_menu li
{
display:inline;
background-image: url(zg/odrazka.png);
background-repeat:no-repeat;
padding-left:"šířka obrázku plus odsazení od textu"px;
height:"výška obrázku";
line-height:"výška obrázku";
#padding-top:"nějaký adekvátní";
}#padding-top:2px; je tam z důvodu, že v IE8 a starších prohlížečích nefunguje line-height a tudíž bude text nalepen nahoru (této technice se říká css hack) BTW. Tohle bys ale zjistil i s pomocí googlu nebo zde a zde. |
||
| Radim Blaťák Profil |
#4 · Zasláno: 22. 11. 2012, 13:50:21
ALLSSA:
Dík, to pomohlo, super. Ještě se tu ale trápím s jednou věcí, a to s tím, že se mi mezi položkami seznamu přepíná kurzor miši do textového zobrazení. Na samotných položkách mám ruku, což je v pohodě, ale ta změna kurzoru mezi položkami mě štve. Na oddělení položek seznamu používám margin. Asi to bude tím. |
||
| panther Profil |
#5 · Zasláno: 22. 11. 2012, 14:17:10
Radim Blaťák:
„Na oddělení položek seznamu používám margin. Asi to bude tím.“ ano, je to tím. Ručičku máš nad odkazem, ne nad ničím jiným. Pokud chceš, aby mezery měly také ručičkový kurzor, musejí být součástí odkazu. Podívej se na rozdíl mezi marginem a paddingem. |
||
| margin Profil * |
#6 · Zasláno: 22. 11. 2012, 14:37:34
ALLSSA:
„Obrázek bude nalepený k levému hornímu rohu“ Pozice pozadí jde přesně usadit pomocí background-position. Radim Blaťák: „Na oddělení položek seznamu používám margin. Asi to bude tím.“ Jednak tím, a pokud máš seznam inline (dělá to i inline-block), tak také případné bílé znaky v kódu. Pokud nepotřebuješ mít menu vycentrované a chceš ho mít bez mezer, tak bych doporučil položky menu i odkazy floatovat. |
||
|
Časová prodleva: 12 let
|
|||
0