XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Der widerspinstige IE6 -> 3 kleine Probleme (http://xhtmlforum.de/showthread.php?t=54724)

Javajim 26.11.2008 20:06

Der widerspinstige IE6 -> 3 kleine Probleme
 
Hallo liebe Community.

Ich bin neu was die Homepagegestaltung angeht. Ich habe mir eine Seite erstellt (bzw. ein Template benutzt und es mir abgeändert) und im Internet nach einem CSS Drop-Down Menu gesucht und dieses erfolgreich editiert und eingebunden.

Habe 2 Dateien (die CSS und die html) angefügt:

Folgende 3 Probleme treten aber bei der Benutzung des IE (6?)auf:

Das Drop Down Menu:

Im Firefox, sowie im IE 7 (zumindest auf meiner Uni) sieht alles fehlerlos aus.
Im IE6 ist das Menu allerdings VOELLIG durcheinander.
Ich habe gehoert man kann unterschiedliche CSS Dateien fuer unterschiedliche Browser laden lassen. Wäre das ne Idee?

Blaue Pfeile auf Page:

Ich habe so Pfeile(als kleine jpgs) mit Hilfe einer Tabelle eingebunden und wieder ist im IE der Fehler. Diesmal gibt es immer nach den ersten beiden oberen Pfeilen einen Umbruch ohne Pfeil und dann gehts normal weiter? (zu sehen in den Dateien)

Rechts der Kasten ist nicht oben sondern UNTEN rechts am text
Der Kasten mit der Kreditkarte des Monats soll oben Rechts sein (so wie im Firefox). Wieder Problem nur im IE


Anbei einmal der Code fürs Menu in CSS:

Code:

.menu {width:759px; height:25px; position:relative; z-index:100;border-right:1px solid #fff; border-top: 0px; font-family:arial, sans-serif; background: #578bb8;}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:759px; w\idth:758px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
.menu ul ul {width:130px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:119.5px;position:relative;}
/* style the links for the top level */
.menu a, .menu a:visited {display:block;font-size:0.8em;text-decoration:none;text-transform: uppercase; font-weight:normal; color:#fff; width:150px; height:24px; border:1px solid #fff; border-width:1px 0 1px 1px; background:#578bb8; padding-left:10px; line-height:23px; font-weight:bold;}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:100px; w\idth:138px;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#467aa7 url(http://www.cssplay.co.uk/menus/breadcrumbs/grey-arrow.gif) no-repeat 130px center;}
/* style the second level hover */
.menu ul ul a.drop:hover{background:#578bb8 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
.menu ul ul :hover > a.drop {background:#578bb8 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#578bb8;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#578bb8;}


Folgend das MENU: Hierbei zu beachten: Es gab Auskommentierte Codes in der Art [if IE6] <table><tr><td></td></tr></table> die ich aber geloescht habe. ich wusste nicht wie ich die ienbinden soll.

HTML-Code:

<div class="menu">
<ul>
 <li class="selected"><a href="index.html">Übersicht<!--[if IE 7]><!--></a><!--<![endif]-->
 <ul></ul>
</li>
<li><a href="top.html">Top 5</a>
        <ul></ul>
</li>

<li><a href="anbieter.html">Anbieter</a>
<ul>
        <li><a href="amex.html">American Express</a></li>
        <li><a href="barclay.html">Barclay Card</a></li>
        <li><a href="citibank.html">Citibank</a></li>
        <li><a href="santander.html">Santander</a></li>
        <li><a href="diverse.html">Diverse</a></li>
</ul>
</li>
<li><a href="spezial.html">Spezial</a>
  <ul>
        <li><a href="dkb.html">DKB Cashkonto</a></li>
        <li><a href="finden.html">Kreditkarte finden</a></li>
        </ul>
</li>

<li><a href="infos.html">Informationen</a>

 <ul>
        <li><a href="kartentypen.html">Kartentypen</a></li>
        <li><a href="gebuehren.html">Gebühren</a></li>
        <li><a href="sicherheit.html">Sicherheit</a></li>
        <li><a href="bestellen.html">Online bestellen</a></li>
  <li><a href="schufa.html">Schufa</a></li>
        <li><a href="geschichte.html">Geschichte</a></li>
 </ul>
 </li>

<li><a href="faq.html">FAQ</a>
 <ul></ul>
</li>

        </ul>
</div>


Vielen Vielen Dank.

Javajim 26.11.2008 20:10

Liste der Anhänge anzeigen (Anzahl: 2)
hier ist das problem zu bestaunen.

Deswegen ist das Problem unter www.wunschkreditkarte/barclay.html zu bestaunen.


hier die files als txt.

die david08 ist die CSS

fricca 26.11.2008 20:15

Das, was du rausgelöscht hast, ist es eben, was der IE6 braucht.
Diese Menüs von Stu Nicholls sind alles andere als banal, und --sorry-- wenn man ihre Funktion nicht versteht, sollte man besser die Finger davon lassen.
In den FAQ findest du einen Link zum Suckerfish-Menü. Das ist ein Tutorial, mit dem du dir das Prinzip erarbeiten kannst. Der IE < 7 bekommt JavaScript-Unterstützung.

Javajim 26.11.2008 20:18

Gut, dann mache ich mich daran, dass zu verstehen. Leider nutzen schliesslich noch soviele Leute den IE6.


Aber was ist mit den anderen beiden Probleme. Die müssten eher banaler Natur sein. :)

Danke

fricca 26.11.2008 20:24

Tut mir leid, was du da mit den Tabellen machst, kann nicht funktionieren. Nimm die weg. Das sind Listen.
Die viel zu breiten Tabellen sind auch die Ursache der herabfallenden Spalte.

Zitat:

<span style="font-weight: bold;">beitragsfrei</span>
Wenn du etwas betonen willst, gibt es die Elemente em und strong.
Lies doch mal was zu semantischem Markup.

Javajim 26.11.2008 20:27

Es wäre ja auch nett, wenn ich jetzt nicht nur wüsste, dass ich alle diese Tabellen entfernen soll (im firefox funktioniert es wunderbar), sonder auch was ich stattdessen mache.

Du musst mir nicht alles im einzelnen erklaeren, aber in eine gewisse richtung könntest du mich bitte lenken. ansonsten hilft mir deine antwort nicht weiter.

was hat das zum beispiel mit den tabellen zu tun, dass die kleinen grafiken sonen umbruch nach den obersten 2en haben? und dann gehen sie ja normal weiter.

gruß

fricca 26.11.2008 20:27

Zitat:

Zitat von Javajim (Beitrag 412111)
Es wäre ja auch nett, wenn ich jetzt nicht nur wüsste, dass ich alle diese Tabellen entfernen soll (im firefox funktioniert es wunderbar), sonder auch was ich stattdessen mache.

Listen!
Folge bitte den Links, die ich poste und lies, was dort steht.

Javajim 26.11.2008 20:38

Jaja sehs jetzt auch. Ich hab eben nur die Hälfte der Nachricht gesehen hehe

entschuldige bitte

Javajim 26.11.2008 22:57

Wie ändere ich am besten die Tabellen mit dem Kreditkartenbildern und den Daten??

Kann ich trotzdem für nen Punkt inner Liste ne Grafik verwenden (die standardpunkte sind so langweilig)


Mein Menu funktioniert jetzt einwandfrei. Das Suckerfish-script konnte ich gut anpassen.

Carolin 27.11.2008 19:52

Ja kannst du, siehe:

list-style-image: Aufzählungsgrafik: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:26 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023