list-style-image + ie7 = problem

**penizillin** · 14.05.2007, 19:59

ja: du machst etwas falsch.

**joextra** · 14.05.2007, 21:32

na, das hilft mir natürlich weiter.

**wahsaga** · 14.05.2007, 21:33

Re: list-style-image + ie7 = problem

Vermutlich die Defaultwerte für margins/paddings von UL und LI nicht überschrieben.

**joextra** · 14.05.2007, 22:19

also das css schaut z.z. so aus:
ul{
float: left;
padding: 0;
margin: 0;
list-style: none;
height:16px;
list-style-image: url(../images/arrow.gif);
}

li{
position: relative;
}

html:
<ul>
<li>
<a href="" target="_blank"></a><br />
</li>
</ul>

so wird das image mal angezeigt mal nicht

**joextra** · 14.05.2007, 22:55

also, ich habe es jetzt geschaft das die grafik angezeigt wird. habe jetzt aber eine weitere frage: wie kann ich den abstand von der grafik zum text verändern? hab schon viel probiert, aber komme nicht weiter

**joextra** · 14.05.2007, 23:14

ok, das habe ich auch geschaft. aber was ich nicht schaffe ist das diese blöde grafik auf einer linie mit dem text steht. die geht leicht darüber. das ist echt zum k....

**pekka** · 15.05.2007, 00:21

Grundlagen!
http://de.selfhtml.org/css/eigenschaften/listen.htm

**joextra** · 15.05.2007, 09:40

das kenne ich schon.
ich habe es mittlerweile geschaft, das es einiger maßen ok aussieht. doch jetzt habe ich ein anderes komische phänomen: mal erscheinen die pfeile im ie 6 & 7 mal nicht. ich habe in einer html zwei listen. eine oben eine etwas weiter unten. die untere wird immer angezeigt, die obere durchschnittlich bei jeden zweiten reload. was soll das?

**Kropff** · 15.05.2007, 10:20

online-beispiel verfügbar? code?

gruß
peter

**joextra** · 15.05.2007, 10:35

online leider noch nicht. hier der code
css:

Code:

ul{
	float: left;
	padding: 0;
	margin: 0;
	border: 0;
	list-style-image: url(../images/arrow.gif);
}

li{
	vertical-align: baseline;
}

html ganz normale liste:

Code:

<ul>
<li>blah
</li>
</ul>

**wahsaga** · 15.05.2007, 11:01

Original geschrieben von joextra

Code:

li{
	vertical-align: baseline;
}

Dieses LI ist kein Element, auf welches vertical-align überhaupt einen Effekt haben dürfte.

**joextra** · 15.05.2007, 11:35

auch wenn du es mir nicht glaubst, es macht schon was aus. nur dadurch habe ich es geschaft, das der text einiger maßen in gleicher linie mit den list-style-image positioniert wird. anders habe ich es leider nicht geschaft. für bessere alternativen bin ich offen

**joextra** · 15.05.2007, 12:05

ich bin etwas weiter gekommen. ich habe eine bsp html datei erstellt. wenn ich diese direkt starte gibt es keine probleme, und die grafik wird problemlos dargestellt, starte ich die aber über meinen lokalen server (xampp) starte, tritt dieses phänomen auf, das die grafik mal angezeigt wird mal nicht. woran kann das liegen?

**joextra** · 17.05.2007, 21:28

so leute. ich konnte endlich die fehlerquelle lokalisieren. es liegt am float:left, nur weiß ich jetzt nicht wie ich das beheben soll. hab schon sehr viel ausprobiert und bin so langsam am verzweifeln. vielleicht könnt ihr mir weiter helfen?
das ganze problem liegt hier:

Code:

.contentText {
	float:left;
	margin-left:16px;
	margin-top:8px;
	color:#D2D2D2;
	font-family:Verdana, Arial;
	font-size:11px;
	line-height:16px;
	text-align:left;
	width:486px;
}

dadurch scheint die grafik beim ie verdeckt zu werden

so sieht das css für die liste aus:

Code:

ul{
	float: left;
	padding: 0;
	margin: 0;
	border: 0;
    list-style: disc outside;
	list-style-image: url(../images/arrow.gif);
}

li{
	vertical-align: baseline;
}

list-style-image + ie7 = problem