Navi in IE @ tutorials.de: Tutorials, Forum & Hilfe

dirkgently · 26.07.06 00:02

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!

Stoffelchen · 26.07.06 07:34

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.

dirkgently · 26.07.06 10:40

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!

Stoffelchen · 26.07.06 12:50

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

dirkgently · 26.07.06 14:04

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!

**Quaese** · 26.07.06 18:33

Hi,

ich hab bei Stu Nicolls ein Menu gefunden und etwas angepasst.

HTML-Code:

<!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

bluex · 26.07.06 21:28

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

webl · 26.07.06 21:45

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

bluex · 26.07.06 21:57

HTML-Code:

<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.

dirkgently · 27.07.06 09:56

Hallo.

Cool.
Vielen Dank!

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

Grüße!

webl · 27.07.06 19:48

Hallo,
muss ich das genauso einsetzen mit dem"<!--[if lte IE 6]>"

Weil bei mir hats nicht geklappt.. Aber das kann auch daran liegen, dass
ich nur einen Mac habe und damit auch nur eine Macversion von IE..
Muss ich da was spezielles einsetzen, weil bei dem Browser wird es auch total
falsch angezeigt.. Danke schonmal!

bluex · 27.07.06 21:24

achsoo. Ja also der fehler Mit dem Boxensystem Besteht soweit ich weis nur in der Windowsversion des IE6. Auf dem Mac ist alles normal.

webl · 27.07.06 23:25

Mir gehts ja nicht um ein Boxensystem.. Bei dem IE fuer den Mac treten auch immer Fehler auf wenn man mit css arbeitet.. Was muss ich denn fuer den InternetExplorer Mac und fuer Opera vielleich noch einsetzen.. Danke!

bluex · 28.07.06 00:38

Das sollte eigendlich das Gleiche sein, wär mir jedenfalls neu wenn man auch noch zwischen den OS unterscheiden muss.

MfG
blueX

webl · 28.07.06 01:54

Hm... Also jetzt bin ich total berfragt.. Sowas dummes hab ich auch noch nicht erlebt..
Im Internetexplorer fuer Windows zeigt ers richtig an aber im Internetexplorer fuer den Mac nicht.. Also da fragt man sich echt was fuer Leute das bei Mircosoft entwickelt haben..

Naja Microsoft eben..

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

Navi css

navi

CSS Navi

Navi-Probs

Navi Problem

E-Mail:

Abonnieren Abbestellen