Grafik über UL

[Karl-Heinz Sommel]

Hallo zusammen,

bin nun ewig mit dem Problem beschäftigt, aber die Lösung ist noch weit:

Ziel:
ich möchte meine Navigation mit Hilfe einer Liste darstellen:
Über die Liste soll eine Grafik. Diese soll ohne jeden Abstand direkt über der Liste.

<img src="" />
<ul>
  <li>1. Nav.</li>
  <li>2. Nav.</li>
  <li>3. Nav.</li>
</ul>

Dazu folgende CSS:

.leftnav img {
 padding: 0px;
 margin-top: 0px;
}

.leftnav ul {
 padding: 0px;
 margin: 0px;
 background-color: #E4E4E4;
}

.leftnav li {
 padding: 0px;
 margin: 0px;
}

Toll - klappt in FF aber nicht in IE. Der fügt ziwschen der Grafik und liste eine spalte.

Also habe .leftnav img einen float hinzugefügt:
.leftnav img {
 padding: 0px;
 margin-top: 0px;
 float: left;
}

Toll - klappt in IE aber nicht in FF. Der fängt jetzt an, die UL um die Grafik zu floaten.

Habe auch schon mit display gespielt - nur leider ohne Erfolg.

Weiß jemand Rat - oder soll ich den Computer aus den Fenster werfen.

Danke schonmal,
Karl-Heinz Sommel

[bleicher]

schan versucht mit negativen margin-werten zu spielen?
MFG
bleicher

[Karl-Heinz Sommel]

hallo bleicher,

vielen Dank für Deinen Ratschlag.

Ja, negative margin-Werte hatten auch keinen Erfolg.

Hättest Du sonst noch eine Idee ?

Besten Dank,
Karl-Heinz Sommel

schan versucht mit negativen margin-werten zu spielen?
MFG
bleicher

[bleicher]

nur so eine Frage - grafik ist ÜBER der Liste, soltle es nicht margin-bottom heissen? grundsätzlich kann man mit entsprechenden margin werten die <img> sogar überlapend über die Liste legen.
MFG
bleicher

[Carl]

Hi,

was mir dazu auffällt ist, dass du beim .leftnav img margin-bottom nicht auf 0 gestellt hast. Das könntest du probieren.

Und noch ein Punkt: Verwendest du die Liste öfters? Sonst wäre es korrekter eine id statt einer Klasse zu verwenden.

Gruß
Carl