Suche im Forum:
Suchen


Autor Nachricht
Beitrag12.08.2011 um 16:41 (UTC)    
Titel: Iceblue - Navigation wird im IE 7 falsch dargestellt

Hallo Leute,

bin ein absoluter Anfänger auf dem Gebiet und hab mir jetzt so halbwegs eine Seite zusammengebastelt. Nun bin ich auf folgendes Problem gestoßen. Die Seite wird in den aktuellen Browern IE und Mozilla korrekt dargestellt. Jetzt hab ich es aber an einem älteren Rechner probiert und da zeigt es im Internet Expolorer 7 die Navigationsleiste falsch an, nämlich nicht nebeneinander sonder die Links zentriert untereinander.

Kann mir da jemand bitte weiterhelfen

Seite ist www.holzmoebel-welt.com

und der Quellcode für das Design sieht so aus:

<body>

<style type="text/css">
<!--
td.headline {
visibility:hidden;
}
/* Design Allgemein- Änderungen nur Profis empfohlen */
table.edit_main_table{width: 90%; margin: 0 auto; min-width: 1000px;}
table.edit_second_table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
.edit_main_tr{width: 0%; height: 0px;}
.edit_navi_headbg{width:0px;height: 0px}
.edit_rechts_cbg{width:0%;}
.edit_rechts_tabelle{margin-top: 28px; padding:0; margin:0;}
.edit_rechts_cbg{height: 490px; background: url() transparent;}

/* Horizontales Menü - Änderungen nur Profis empfohlen */
.edit_navi_headbg table{position: absolute; width: 89.5%; min-width: 1000px; background-color:#ffcc00; height: 25px;}
.edit_navi_headbg table td{background: transparent url(); width: auto; height: 25px; display:inline; text-align: center;}
.edit_navi_headbg table tr {float: left;}

/* Bestimmte Bereiche ausgeblendet */
.edit_rechts_bottom{display:none;}
.edit_rechts_sbg{display:none;}
.nav_heading{display:none !important;}
.edit_below_nav img{display:none;}
.edit_content_bottom{display:none;}
.edit_content_top{display:none;}

/* Layout - kann beliebig verändert werden */
td.edit_content{height: 550px; background: url() #ffffff; padding: 10px 0 10px 0;} /* Der Textbereich */
td.edit_content_bottom2{background-image:url();} /* Die untere Grafik vom Textfeld */
td.edit_header_full{background: url(http://img.webme.com/pic/h/holz-moebel/mynewbanner.png) no-repeat #ffcc00; height: 104px;} /* Der Header vom Design */
td.edit_navi_headbg table td a{color: #fff; font-size: 15px; background: url() transparent;} /* Links im Menü */
td.edit_navi_headbg table td a:hover{text-decoration:underline;} /* Hover-Links im Menü */
tr.checked_menu td a{font-weight: bold; color: #FFF1AF;} /* Aktive Seite, die gerade ausgewählt ist im Menü */
td.edit_content div{margin-top: 25px;} /* oberer Abstand des Inhaltes vom Menü */

body { background-color:#E0E0E0}
-->
</style>
</body>


Vielen Dank schonmal für die Hilfe
Beitrag15.08.2011 um 11:16 (UTC)    
Titel:

Probiere es mal mit folgenden Änderungen:

Code:
/* Horizontales Menü - Änderungen nur Profis empfohlen */
 .edit_navi_headbg table{position: absolute; width: 89.5%; min-width: 1000px; background-color:#ffcc00; height: 25px; display:inline;}
 .edit_navi_headbg table td{background: transparent url(); width: auto; height: 25px; display:inline; text-align: center;}
 .edit_navi_headbg table tr {float: left; display:inline;}
Beitrag15.08.2011 um 13:48 (UTC)    
Titel:

schau mal, ob das hier auch so ist. falls nicht, dann gebe ich dir den code und du kannst ihn anpassen. http://6pdesign002.de.tl/

gruss gringo

tip: mach den haeder anders, ohne die begrenzung im bild, einfach nur text auf einfarbigen hintergrund. und bitte den haeder mittig.
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 15.08.2011, 14:50, insgesamt einmal bearbeitet
Beitrag16.08.2011 um 05:53 (UTC)    
Titel:

Hallo,

vielen dank euch beiden für die antworten geht aber leider beides nicht.
bei dem geänderten Quellcode von freefunstuff zeigt es das Navi Menü immer noch mittig untereinander anstatt nebeneinander.

und bei der Seite von dir gringo ist es der selbe Fehler wie bei mir nur das deine menüleiste linksbündig angezeigt wird.

Habt ihr noch andere Ideen?

Grüße Eric
Beitrag16.08.2011 um 12:11 (UTC)    
Titel:

hab das gerade mal geprüft und hast recht. das hätte ich jetzt nicht erwartet.

gut, dass du das gepostet hast. macht ja wenig sinn wenn der code nicht hinhaut.

bin ja richtig schockiert Shocked

gruss gringo

vorschlag: wie wäre es in der art? du musst dir die werbung natürlich wegdenken. die navigation wäre dann über dem haeder und automatisch mittig. statt bilder (die vorher beschriftet werden müssen, kann man auch einfach verlinkte texte (Home, Kontakt) nehmen. muss den code nur noch als "blank" machen, damit sich nicht eine neue seite im explorer öffnet.

http://6pdesign002.de.tl/
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 16.08.2011, 14:30, insgesamt 3-mal bearbeitet
Beitrag16.08.2011 um 14:26 (UTC)    
Titel:

Hallo,

6p-iceblue hat Folgendes geschrieben:
macht ja wenig sinn wenn der code nicht hinhaut.

Der code haut ja hin. Nur nicht bei den alten Versionen des IE. Selbst ich als absoluter verfechter von Barierefreiheit sage, dass man auf Nutzer von alten IE keine Rücksicht nehmen sollte. Über kurz oder lang wird Microsoft auch versuchen den IE 7 aus dem Netz zu nehmen, so wie sie es aktuell mit dem IE 6 (siehe meine Signatur) machen. Immerhin ist der auch schon fast 5 Jahre alt, was in der Informatik ein Jahrhundert ist!

Man könnte die Besucher, welche diese alten Dinger nutzen, mit Hilfe von conditional comments daraufhinweisen, dass ihr Browser aus der Steinzeit stammt und sie ihn doch aktualisieren sollten, da die Seite (wie so ziemlich alle) mit diesem Browser nicht richtig dargestellt wird. Alternativ kann man natürlich auch eine Ersatznavi extra für diese Browser machen.
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering
Beitrag16.08.2011 um 14:30 (UTC)    
Titel:

wenn du jetzt noch sagst was das ist: conditional comments, dann weiß ich bescheid. denke aber, dass beim besuchen mit dem ie7 ein text auftaucht?

falls das so ist, dann funktioniert das aber wohl auch im ie7, hehe.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 16.08.2011, 15:32, insgesamt einmal bearbeitet
Beitrag16.08.2011 um 14:37 (UTC)    
Titel:

Conditional Comments, sind Kontrollstrukturen, welche nur von Microsoft Produkten intepretiert werden. Dadurch kannst du in Html Dokumenten Code schreiben, welcher nur von bestimmten IEs gelesen wird und von allen anderen Browsern nicht. Bsp:
Code:
<!--[if lte IE 8]> Hier steht jetzt was <![endif]-->

Der Code, der hier steht wird nur von IEs gelesen, die älter als Version 8 sind.
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering
Beitrag16.08.2011 um 14:40 (UTC)    
Titel:

ach so, und den fügt man dann zum beispiel in einem intro ein oder auf der startseite?

aber irgendwie hast du recht. wrr ein originals windows hat, kann auch updates machen. wer es nicht kann, hat wohl eine gecrackte version. oder kein internet mehr, aber dann kann er die seite eh nicht besuchen, hehe.

gruss gringo

edit: hab es eben getestet und es funktioniert. kannst das so schreiben, dass man größe und farbton der schrift anpassen kann?
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 16.08.2011, 15:47, insgesamt 2-mal bearbeitet
Beitrag16.08.2011 um 14:55 (UTC)    
Titel:

Du kannst dazwischen alles schreiben, was du willst. Html, Css und ich meine auch Javascript.

Ich kann auch nicht nachvollziehen, warum manche Leute, insbesonderem Nutzer des IE, ihre Browser nicht updaten. Es ist ja nicht nur so, das die alten dinger manche dinge nicht unterstützen, manche dieser Microbug Produkte unterstützen noch nichtmal CSS 1.0 vollständig, es stellt auch ein Sicherheitsrisiko da. Zumal Microsoft in Sachen Html 5 und CSS 3 mit der neuen 9er Version wirklich aufgeholt hat und auf einem ordentlichem Weg ist.

EDIT: Mir fällt gerade ein, selbst Youtube, unterstützt die aktion in meiner Signatur und schließt Nutzer von alten IEs komplett aus!
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering


Zuletzt bearbeitet von o-4-n am 16.08.2011, 16:05, insgesamt einmal bearbeitet
Beitrag16.08.2011 um 15:27 (UTC)    
Titel:

alternativ könnte man es auf der art machen, hab es aber noch nicht farbig angepasst.

http://6pdesign001.de.tl/

dann kommt aber wieder das wanderungsproblem. wenn man nicht allzu viele seiten hat. macht das aber nichts. und ich denke mal, dass man auch mindestens 1024er auflösung haben sollte. mit 800er sehen fast alle seite schlecht oder verschoben aus.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell

Beitrag17.08.2011 um 10:15 (UTC)    
Titel:

Hallo Gringo,

also zu der kleinen Debatte von euch natürlich habt ihr vollkommen recht mit euren Aussagen und es sollte jeder ein Update von dem schrecklichen IE 7 machen, aber das problem ist mir nämlich erst aufgefallen als ich hier in meiner Firma auf der Seite war und wir haben die OS vom Server und da ist leider noch der IE 7 Standard und in der Firma meiner Frau die auch weltweite Niederlassungen haben läuft auch noch der IE 7. Nur deswegen sollten wir da noch eine Lösung finden Wink

Also der letzte link den du gepostet hat der geht im IE 7 da werden die Navi links horizontal angezeigt. Nur wenn ich deinen Quellcode in meins kopiere zeigt es mir nur vorn den Home Button an und nicht mehr die restlichen die ich schon erstellt hab über den Homepage Baukasten. Das Header Bild einfügen und Farben ändern bekomm ich dann schon hin Wink

Mit dem zweiten den du gepostet hast wo die Links über dem Header sind das möchte ich nicht Wink

Mit den conditional comments das hab ich leider ne so ganz geblickt ist es damit theoretisch möglich ein Design reinzupacken welches nur der IE 8 und kleiner ließt? Dann wäre es ja möglich für die neueren Browser das horizontal zu lassen und für die älteren dann halt linksbündig oder ist das so nicht möglich?

Ideal wäre natürlich für alle versionen gleiches design Wink

Hoff das wir das hinbekommen.
Beitrag17.08.2011 um 10:39 (UTC)    
Titel:

Zitat:
<center>
<style type="text/css">
<!--
table.edit_main_table{width: 100% !important;}
table.edit_main_table, table[height="102"]{margin: 0 auto;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 5% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 5% !important;position: absolute;left: -300px;}
td.edit_rechts_cbg{width:100%;}

td.sidebar_heading{visibility: hidden;}
td.nav_heading{display: none;}
td.headline{visibility:hidden;}
td.headline2{visibility:hidden;}


td.edit_main_tr{height: 0px !important;}
td.edit_rechts_cbg{height: 0px !important;}
td.edit_rechts_bottom{height: 0px !Important;}
td.edit_navi_headbg{height: 0px !important;}

td.edit_content{background-image:url();background-color:#969696;border: 1px solid #759BB2;}

td.nav:hover{display: none;}

td.nav{display: none;}

td.shouty, td.shouty2, td.shouty3, td.shouty4, td.shouty5{
background-image:url(http://img.webme.com/pic/d/designcodes/shouty2.png);
background-repeat:repeat;background-color:#XXXXXX;font-family: tahoma;font-size: 12px;
color:#ffffff;border: 1px solid #c0c0c0;}

td.edit_below_nav img{display: none;}
td.edit_below_nav{background-image: url();
background-position: center top;background-repeat: no-repeat;}

td.edit_rechts_cbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

body{background-image:url();background-color:#16242A;}
body {background-attachment:fixed;border: 0px solid #c0c0c0;}

td.edit_rechts_sbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_rechts_bottom{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_content_top,td.edit_content_top:hover{background-image:url(http://img.webme.com/pic/6/6p-bilder/orgicebluecontop.png);height: 30px;background-color:#XXXXXX;border: 0px solid #000000;}

td.edit_navi_headbg{display: none;}

td.edit_rb_footer{background-image:url();height: 30px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_bottom2{background-image:url(http://img.webme.com/pic/6/6p-bilder/orgicebluecontop.png);background-color:#XXXXXX;height: 30px;border: 0px solid #XXXXXX;}

td.edit_content_bottom{display: none;}

td.headline2{font-family: arial;font-size: 13px;color: #c0c0c0;text-decoration: none;}

td.nav a{font-family: arial;font-size: 12px;color: #000000;text-decoration: none;}

td.edit_content_main div{overflow: hidden!important;}

td.edit_header_full{background-image:url();background-color:#16242A;width:
930; height: 120px;background-position: center top;background-repeat: no-repeat;border: 1px solid #969696;}

/* ------ NEUE NAVI OBEN ------- */

/* Position + Groesse Navi-Feld oben */
#Navi_oben {
position: absolute;
left: 50%;
top: 293px;
margin-left: -465px;
width: 930px; }

/* Aussehen der Navi-Links oben */
td.oben a {
display: block;
font-size: 12px;
font-family: arial;
color: #99ccff;
text-decoration: none;
height: 25px;
line-height: 25px;
text-align:center;
margin-left: 4px;
margin-right: 4px;
background-color: ;
background-image: url(http://img.webme.com/pic/6/6p-iceblue/cssbutt3.png);
border: 1px solid #1f57ac;
-moz-border-radius: 5px; }

td.oben a:hover{
display: block;
font-size: 12px;
font-family: arial;
color: #C26017;
text-decoration: none;
height: 25px;
line-height: 25px;
text-align:center;
margin-left: 4px;
margin-right: 4px;
background-color: ;
background-image: url(http://img.webme.com/pic/6/6p-iceblue/cssbutt4.png);
border: 1px solid #C26017;
-moz-border-radius: 5px; }


/* ------ NEUE NAVI OBEN ------- */

/* Position + Groesse Navi-Feld oben */
#Navi_oben {
position: absolute;
left: 50%;
top: 246px; margin-left: -465px;
width: 930px; }

/* Aussehen der Navi-Links oben */
td.oben a {
display: block;
font-size: 12px;
font-family: arial;
color: #99ccff;
text-decoration: none;
height: 25px;
line-height: 25px;
text-align:center;
margin-left: 4px;
margin-right: 4px;
background-color: ;
background-image: url(http://img.webme.com/pic/6/6p-iceblue/cssbutt3.png);
border: 1px solid #1f57ac;
-moz-border-radius: 5px; }

td.oben a:hover{
display: block;
font-size: 12px;
font-family: arial;
color: #C26017;
text-decoration: none;
height: 25px;
line-height: 25px;
text-align:center;
margin-left: 4px;
margin-right: 4px;
background-color: ;
background-image: url(http://img.webme.com/pic/6/6p-iceblue/cssbutt4.png);
border: 1px solid #C26017;
-moz-border-radius: 5px; }

-->
</style>

<div id="Navi_oben">
<table style="width:930px;">
<tr>

<td class="oben"><a href="http://6p-iceblue.de.tl/Home.htm">Home</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Design_Galerie/index.htm">Galerie</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Tools-und-Zubeh.oe.r-.htm">Tools</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Kostenlose-Downloads.htm">Downloads</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Banner-und-Buttons.htm">Banner und Buttons</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Verlink mich.htm">Verlink mich</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Impressum.htm">Impressum</a></td>

<td class="oben"><a href="http://6p-iceblue.de.tl/Hilfreiches.htm">Hilfreiches</a></td>


<td class="oben"><a href="http://6p-iceblue.de.tl/G.ae.stebuch.htm">Gästebuch</a></td>

</tr>
</table>
</div>




ich hab mal markiert, wie man seiten dann zufügt. das rote ist die url, und das grüne ist der name, der auf den button steht.

mit dem ersten roten, musst du mit dem wert spielen. die höhe ist in dem code ausgerichtet, wenn man noch die werbung hat. musst also den abstand verringern.

alles bei text über dem design einfügen. 9 oder 10 seiten, sollten kein problem sein. teste es für dich.

hebe deinen alten code aber in einer textdatei (nicht word) auf.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 17.08.2011, 11:44, insgesamt einmal bearbeitet
Beitrag17.08.2011 um 11:22 (UTC)    
Titel:

Hey Gringo,

super das funktioniert so *freu*

Jetzt muss ich nur noch wieder die ganzen Farben auf meine Farben ändern und dann hab ich es.
Die Farben der Navigationslinks kann ich auch ändern oder? sind jetzt irgendwie fix?

Vielen vielen dank schonmal, bin jetzt echt erleichtert das es funktioniert Smile

Grüße
Beitrag17.08.2011 um 11:26 (UTC)    
Titel:

du kannst alles ändern, es ist nichts fix.

da wo nun die buttons drin sind, ist der bereich: td.edit_content_top

lösche das bild raus und nimm einen farbton. das gleiche machst du für die buttons. den rahmen der buttons stellst du auf null und schon ist das wie in deiner vorherigen seite.

nun noch den haeder bearbeiten. nimm einen einfarbigen hintergrund und beschrifte ihn. die größe steht im code und kannst ihn auch in der höhe ändern, dann aber neu positionieren. denn die navi ist bei dir auf den header von mir ausgelegt.

wenn du dein headerbild drin hast, erweiterst du ihn im farbtonbereich (zur zeit #xxxxxx im haedercode).

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 17.08.2011, 12:32, insgesamt 2-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de