Grafik verrutscht im iexplorer

[Krobbus]

Hallo,
ich habe ein Problem, und war wird mein navigationsmenü im internetexplorer nicht richtig dargestellt, in firefox aber schon. kann ich den code irgendwie ändern so dass er auch im iexplorer so dargestellt wird wie in firefox?

So sieht der code in firefox aus: (Auf "Bilder vergrößern" klicken)
firefox Bilder und Fotos im Fotoalbum auf Bilder-Speicher.de

und so im iexplorer: (die flagge ist völlig verrutscht und befindet sich nicht mehr rechts vom menü:)
internet explorer Bilder und Fotos im Fotoalbum auf Bilder-Speicher.de

Hier der Code:

<div id="navigation">
<ul>
<li class="selected"><a href="#">Home</a></li>
<li><a href="#">Deal1</a></li>
<li><a href="#">Deal2</a></li>
<li><a href="#">Login</a></li>
<li><a href="#">Register</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">Support</a></li>
<p align="right"><a href="http://#" 

align="right"><img src="deutsch.jpg"></a></p>
</ul>
</div>

Und hier der css code die benutzt wird

#navigation{
height:2.2em;
line-height:2.2em;
width:958px;
margin:0 1px;
background:#578bb8;
color:#ffffff;
}

 

[Efchen]

Moin,

möglicherweise versteht der IE das Attribut align im a-Tag nicht. Ich verstehe aber auch nicht, warum Du das nicht mit CSS machst. Und was macht <p align=right>? Ein Blockelement rechts ausrichten? Wo doch das Blockelement ohnehin über die gesamte Breite geht?

Also ich würde Dir empfehlen, einen geeigneten Doctype zu wählen, eine vollständige HTML-Seite zu machen, Inhalt und Layout zu trennen und Dein Design/Layout mit CSS zu machen. Der Code, den Du uns gezeigt hast (ich gehe mal zu Deinem Gunsten davon aus, dass das nicht alles ist), ist nichts Halbes und nichts Ganzes.

Gruß,
-Efchen

P.S.: Warum ist das hier im Forum eigentlich so weit verbreitet, immer nur Code zu posten, anstatt einen Link zur Seite? So kann man Fehler dann doch viel besser suchen und finden.

 

[koslowski]

Hi,

Moin,
P.S.: Warum ist das hier im Forum eigentlich so weit verbreitet, immer nur Code zu posten, anstatt einen Link zur Seite? So kann man Fehler dann doch viel besser suchen und finden.

das würde ich auch gerne wissen.:-)

Entweder einen Link oder den kompletten code/css hier einstellen.

Allein an den beiden Codeschnipseln sieht man schon sehr unschöne Sachen (align, height und line-height).
Scheint eine größere Baustelle zu sein.

koslowski

 

[nichtsgeht]

<p> darf doch nicht innerhalb eines <ul> stehen, oder Irre ich mich da ?

 

[Efchen]

Hallo,

<p> darf doch nicht innerhalb eines <ul> stehen, oder Irre ich mich da?

Du irrst Dich: SELFHTML: HTML/XHTML / Referenz /HTML-Elementreferenz

Gruß,
-Efchen

Edit: Ich ging davon aus, dass Du innerhalb eines <li> meintest. Ansonsten hast Du natürlich recht.

 

[Krobbus]

hi effchen,
mit dem <p align=right> will ich das image (eine flagge) an die rechte seite der leiste setzten. wie kann ich das anders machen?

(das ist halt so ne horizontale navigation, und in der rechten ecke soll die flagge sein weil man dort die sprache der seite wechseln kann)

ps.:nichtsgeht, ich hab schon probiert das <p align="right"><a href="http://#" align="right"><img src="deutsch.jpg"></a></p>
hinter das </ul> zu setzten, dadurch verrutscht das bild nicht mehr in die nächste zeile. aber es gibt einen unschönen blauen streifen der unter den links der navigation lang läuft

 

[Efchen]

Hi Krobus,

hi effchen,
mit dem <p align=right> will ich das image (eine flagge) an die rechte seite der leiste setzten. wie kann ich das anders machen?

Indem Du beispielsweise Deine Flagge rechts floatest, also mit CSS an den rechten Rand klebst, anstatt mit veralteten HTML-Attributen.

Gruß,
-Efchen

 

[Krobbus]

hi effchen,
könntest du mir das vielleicht mit konkretem code verdeutlichen? bin noch etwas unbedarft mit css. :)
die flagge müsste trotzdem noch ein link sein, geht das?

wär voll nett, liebe grüße

 

[nichtsgeht]

So müsste es gehen. Ps.: alt im img-Tag nicht vergessen ;-)

<div id="navigation">
<div stye="float: right;"><a href="http://#" align="right"><img src="deutsch.jpg" alt=""></a></div>
<ul>
<li class="selected"><a href="#">Home</a></li>
<li><a href="#">Deal1</a></li>
<li><a href="#">Deal2</a></li>
<li><a href="#">Login</a></li>
<li><a href="#">Register</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">Support</a></li>
</ul>
</div>

 

[Efchen]

die flagge müsste trotzdem noch ein link sein, geht das?

Das eine hat mit dem anderen rein gar nichts zu tun. HTML ist für die Beschreibung des Inhalts da. Wenn Du einen Text als Link auszeichnen willst, dann zeichnest Du ihn als Link aus. Wie das dann am Bildschirm dargestellt, am Drucker ausgedruckt oder vom Screenreader vorgelesen wird, ist Sache von CSS, dem es wiederum egal ist, ob es ein Element vom Typ "Adresse" oder ein Element vom Typ "Link" formatieren soll.

Das ist ein ganz entscheidender Punkt bei der Arbeit mit CSS.

könntest du mir das vielleicht mit konkretem code verdeutlichen?

<p style="float:right;"><a href="xxx" title="Kisuaheli"><img src="flagge.jpg" alt="Sprache wechseln" /></a></p>

bin noch etwas unbedarft mit css.

Das solltest Du unbedingt ändern, wenn Du mehr machen willst und willst, dass sich die Besucher auf Deiner Website wohlfühlen. Auch HTML lernen ist wichtig, die meisten "CSS-Umsteiger" können nämlich nichtmal HTML.

Schönen Abend,
-Efchen


wär voll nett, liebe grüße[/quote]

 

[Efchen]

So müsste es gehen. Ps.: alt im img-Tag nicht vergessen ;-)[ /quote]

Guter Tipp, aber dann auch:

<div stye="float: right;">

Warum ein div? Gibt es kein Tag, was den folgenden Inhalt besser beschreibt? Zumindest ein <p> sollte es sein.

<a href="http://#" align="right">

Weg mit dem align=right, das ist old-fashioned.

<img src="deutsch.jpg" alt="">

Na, wo ist denn nun der Inhalt des alt-Attributs? Da muss natürlich ein Text stehen, der eindeutig vermittelt, was man da anklicken kann.

Aber an sich passts natürlich :-)

Gruß,
-Efchen

 

[Krobbus]

So müsste es gehen. Ps.: alt im img-Tag nicht vergessen ;-)[ /quote]

Guter Tipp, aber dann auch:



Warum ein div? Gibt es kein Tag, was den folgenden Inhalt besser beschreibt? Zumindest ein <p> sollte es sein.



Weg mit dem align=right, das ist old-fashioned.



Na, wo ist denn nun der Inhalt des alt-Attributs? Da muss natürlich ein Text stehen, der eindeutig vermittelt, was man da anklicken kann.

Aber an sich passts natürlich :-)

Gruß,
-Efchen

Erstmal danke für deine Mühe Effchen,
ich habe jetzt folgenden Code:

<div id="navigation">
<p style="float: right;"><a href="http://#"><img src="deutsch.jpg" alt="kommt noch"></p>
<ul>
<li class="selected"><a href="#">Home</a></li>
<li><a href="#">Deal1</a></li>
<li><a href="#">Deal2</a></li>
<li><a href="#">Login</a></li>
<li><a href="#">Register</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">Support</a></li>
</ul>
</div>

Mit firefox wird es richtig dargestellt, allerdings wird im internet explorer ein unschöner blauer horizontaler balken unterhalb des (ebenfalls horizontalen) menüs dargestellt. Woran kann das liegen? (Hier nochmal ein Bild wie es im Iexplorer dargestellt wird: blauerbalken Bilder und Fotos im Fotoalbum auf Bilder-Speicher.de )

hier nochmal mein css-code der navigation:

#navigation{
height:2.2em;
line-height:2.2em;
width:958px;
margin:0 1px;
background:#578bb8;
color:#ffffff;
}

#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #ffffff;
white-space:nowrap;
}

#navigation li a{
display:block;
padding:0 10px;
font-size:0.8em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}

 

[Faschli]

Hallo,

ich habe auch ein Problem :
Im Firefox geht es aber im Explorer nicht.
Das Menü auf der Hauptseite geht komischer Weisse
bei beiden aber die Unterseite nicht im Explorer.

Wo der Fehler ist weiss ich nicht.

Hauptseite :
Chiptuning vom Feinsten Tuning Tuningchip www.car-tuningchip.de

Unterseite :
Chiptuning Audi Chip Tuning Tuningchip Optimierte Leistungssteigerung

Wäre lieb von euch, wenn Ihr mir mal den Fehler durchgebt,
bin erlich schon am verzweifeln.

Gruß Faschli