ugrás a tartalomhoz

li.dir és li.file lista elemek formázása

Anonymous · 2006. Már. 11. (Szo), 21.39
Sziasztok.
Az alabbi modon formaztam a li elemet.Azt szeretnem hogy a li.dir legyen az alabbi modon,viszont a li.file legyen circle.


li.dir{ list-style-image: url(images/right.gif) }
li.file {list-style-type: circle}

Igy viszont minden elemhez kepet rak be.
Hogy lehet megoldani?

Koszi.
 
1

Érdekes...

-zsolti- · 2006. Már. 11. (Szo), 21.46
...nálam ez így működik IE, FF, Opera alatt is. Biztos, hogy jól adtad meg a li elemeket? class="dir" illetve class="file"?

Mindazonáltal a szintaktikára érdemes ügyelni, ha igényes vagy. Ha egyszer teszel szóközt a { jel elé, akkor tegyél máshol is, a definiciók végén pedig pontosvessző.
2

Va:

Anonymous · 2006. Már. 11. (Szo), 21.52
Igen,minden betarva.
3

Va:

Anonymous · 2006. Már. 11. (Szo), 22.00

igy csinaltam:
li.dir{list-style-image: url(images/right.gif)}
li.file{list-style-type: disc; color: #069B9E}
4

;

pint3r · 2006. Már. 11. (Szo), 22.56
Ahogy Zsolt is írja, zárd le az utolsó elemet is pontosvesszővel, annak a hiánya is szokott furcsaságokhoz vezetni!
5

Va:

Anonymous · 2006. Már. 13. (H), 13.45
Ugyanaz.
6

UI:

Anonymous · 2006. Már. 13. (H), 13.53
Galeon -ban meg Opera-ban meg Mozilla -ban is ugyanaz a 'hiba'.
A teljes css kod:

<style type="text/css">
li.dir {list-style-image: url(images/right.gif);}
li.file {list-style-type: disc; color: #069B9E;}
a:hover{
   color: #069597;
   background-color: #E7ECAC;}
</style>
Operaban meg kozvetlen a kep melle teszi az li -ben a szoveget,mozillaban meg galeonban egy 'Tab'-nyi tavolsaggal jobra teszi.Ah....:(
8

talán

winston · 2006. Már. 13. (H), 13.58
lehet, hogy én értem félre a dolgot, de én így csinálnám:

.dir
  {
  list-style-image: url(images/right.gif);
  }

.file
  {
  list-style-type: disc;
  color: #069B9E;
  }
a html-t pedig:

<li class="dir">ide a szöveg</li>
7

Előbb a class + background

Edit · 2006. Már. 13. (H), 13.57
Próbáld ki, hátha így megy (nem próbáltam ki):

.dir li { ...;}
.file li { ...;}
Ha így sem megy, akkor háttérként kellene beállítani a listajelet:

.dir li { background: url(images/right.gif) no-repeat 0 50%; padding-left: 15px; }
9

Va:

Anonymous · 2006. Már. 13. (H), 14.06
Minden lehetoseget kiprobaltam a fentiek kozul.Eredmeny ugyanaz.

ez : .dir li { background: url(images/right.gif) no-repeat 0 50%; padding-left: 15px; }
meg csak nehany li -hez rakja be a kepet.
10

hm...

winston · 2006. Már. 13. (H), 14.10
nem lehet, hogy a kép túl nagy, kilóg, és letakarja a körülötte levőt? (próbáld meg az overflow tagot használni)

ps: légyszi használd a BB code-okat, mert így kicsit sz*r olvasni a kódot.
11

én így csinálnám

Anonymous · 2006. Már. 13. (H), 14.15

li.dir {
  list-style: none url(images/right.gif);
}
li.file {
  list-style: disc none;
}

<ul>
<li class="dir">könyvtár</li>
<li class="file">file</li>
<li class="file">file</li>
<li class="file">file</li>
</ul>
nekem tökéletesen működött ie6, ff1.5, opera8.51 alatt.

gex

u.i: ha akarod felteszem a html-t netre.
12

már volt

winston · 2006. Már. 13. (H), 14.18
ha kicsit feljebb nézel, már írtam majdnem ugyan ezt (valamiért nem megy nála, pedig kéne...) kezdek arra gyanakodni, hog elgépelsz valamit, vagy a gépeden van valami elállítva.
13

még nem

Anonymous · 2006. Már. 13. (H), 14.24
ha kicsit feljebb nézel, talán Te is észreveheted, hogy ez így ebben a formában még nem szerepelt.

gex
14

Va mindenkinek

Anonymous · 2006. Már. 17. (P), 19.56
Koszi mindenkinek.
Az utolso lehetoseget meg nem probaltam,de hamarosan ki fogom.
ui: amugy ez az egesz html,css dolog ,...
Jo lenne egy mar egy reform:-)