Navi in IE

Status
Nicht offen für weitere Antworten.
D

dirkgently

Erfahrenes Mitglied
Hallo.

Ich bin dabei eine Webseite mit css zu machen.:(
Da es einige Probleme gibt, habe ich beschlossen alles mal klein anzufangen und mich ran zu tasten..
Ich hab die Navigation mal nachgebaut.
Link

unter Mac und FF oder Mazilla sieht alles gut aus. Aber wenn ich mir das mit dem PC anzeigen lasse, sieht alles völlig sch... aus.

Vielleicht hat jemand ein Tip für mich

Kann doch nicht so schwer sein, etwas Kompatibles für das Gängigste zu machen ..

Grüße!

;)
 
Hmm... das Problem hab ich auch schon... die, für mich, einfachste Lösung ist gewesen, meinen Freund dran zu setzen und eine Abfrage schreiben zu lassen (weil ich nicht wusste, wie das ging), die vorher überprüft, welchen Browser der Besucher benutzt. Damit könntest du dann unterschiedliche .css Dateien aufrufen lassen, die für den jeweiligen Browser angepasst sind.

Aber ich könnte mir vorstellen, dass es da noch eine einfachere Variante gibt. Ich neige nämlich immer dazu den 'unvorteilhaftesten' weg zu gehen. ^^
 
Hi :)

Danke für den Tip!
und dann bist du mit 2 css dateien ausgekommen? :-)

Was hast du denn dann bei der IE Version verändert, dass es funktioniert hat?

Grüße!
 
nein... ich glaube damals hatte ich 3 .css Dateien ^^ ...

ich hab einfach ein paar Werte wie z.B. widht oder height geändert, damit es halt passt... manchmal hab ich auch ein bischen an top und left feilen müssen... aber ansonsten ging es eigentlich...

kopier deine jetzige .css datei einfach und änder ein paar Werte, damit dir die Site auch im IE gefällt :)
 
Danke dir!;)

Das ist vielleicht echt gar keine schlecht Idee.!

Zwar komisch, so einen "komischen" Aufwand zu betreiben. Aber warum nicht.
Ich hab den Eindruck, alles wird komizierter, als einfacher mit css....

Grüße!
;)
 
Hi,

ich hab bei Stu Nicolls ein Menu gefunden und etwas angepasst.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
  <!--
body{ margin: 0px;
      padding: 0px;
      font-family: "Lucida Grande", Lucida, Helvetica, Arial, sans-serif;}

#navi_text{ margin: 0;
            padding: 0;
            text-align: center;
            color: green;
            height: 26px;
            background: #eee url(http://www.jochen-wendl.de/Nav_test/navi_navigation.jpg) repeat-x;}

#Navigation{ display: table;
             padding: 0;
             list-style-type: none;
             line-height: 0.95em;
             white-space: nowrap;  /* Zeilenumbruch unterbinden und Text auf einer Zeile halten */}

#Navigation li{ display: table-cell;
                border-right: 3px solid green;}

#Navigation li input.btnSubmit{ margin: 1px 10px 1px;
                                font-size: 0.8em;}
#Navigation li input.favorites{ margin-left: 10px;}

#Navigation a{ display: block;
               padding: 4px 10px;
               color: #000;
               text-decoration: none;}
#Navigation a:visited{ color: #666;}
#Navigation a:hover{ color: gray;}

#Navigation li a.first{ border-left: 3px solid green;}

.zentriert {margin: 0 auto;}
 //-->
</style>

<!--[if IE]>
  <style type="text/css">
  <!--
#Navigation{ display: inline-block;
             width: 1px;   /* IE passt die Grösse automatisch an das Menü an */
             padding: 0 2px;
             font-size: 1.05em;}

#Navigation li{ display: inline;}

#Navigation li input.btnSubmit{ margin: 0;}

#Navigation a,
#Navigation a:visited{ display: inline-block;
                       margin: 0 -2px;}
  //-->
  </style>
<![endif]-->
</head>
<body>
<div id="navi_text">
	<ul id="Navigation" class="zentriert">
	  <li><a class="first" href="#">Home</a></li>
	  <li><a href="#">Produktservice</a></li>
	  <li>
	    <input name="ean_nummer" type="text" class="favorites" value="EAN Nummer eingeben" maxlength="20" />
	    <input type="submit" class="btnSubmit" name="Submit" value="los" />
	  </li>
	  <li><a href="#">Download</a></li>
	  <li><a href="#" class="Navigation">Impressum</a></li>
	  <li><a href="#">Kontakt</a></li>
	  <li><a href="#">Über uns </a></li>
	</ul>
</div>
</body>
</html>
Vielleicht kannst Du etwas damit anfangen.

Ciao
Quaese
 
Du musst beim ie immer alles extra machen was mit dem Boxensystem zu tun hat. Leider sind die Programmierer des IE so schlecht das sie sich nicht an die Webstandarts halten können und fehler im IE gemacht haben..... wir dürfens jatzt leider ausbaden....

Beim Boxensystem musst du z.b. die maße für den IE immer extra nochmal definieren, und rumprobieren bis es auch dort passt, weil der IE sich leider immer verrechnet. Auch mit nicht definierten backrounds hat der IE so seine Schwierigkeiten...

mfg
blueX
 
Hi,
und wie kann man das dann umsetzen, dass der fuer IE zum Beispiel basic3.css, fuer Opera, was auch nicht wirklich toll ist basic2.css und dann noch fuer Safari von Apple und Firefox basic.css laedt.. Hab naemlich bei meiner jetzigen Webseite, die ich erstelle auch das Prolem.. Vielen Dank schonmal!

MfG
webl
 
HTML: 
<link rel="stylesheet" media="all" type="text/css" href="css/style.css" />
<!--[if lte IE 6]>
<link rel="stylesheet" media="all" type="text/css" href="css/style_ie.css" />
<![endif]-->

So zum Beispiel für den ie6.

In der ersten wird alles festgelegt und die Sachen die du für einen anderen Browser anders machen musst, definierts du in der nächsten Datei dann einfach nochmal und überschreibst den alten Wert somit.
 
Hallo.

Cool.
Vielen Dank!

Das mit IE nervt schon ziemlich...
Aber ich denke mit 2 css dateien kommt man wohl aus...


Grüße!;)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück