Html Seite wird im ie falsch angezeigt

[dune89]

Meine Seite ist sehr klein, hat ein paar DIV ids und mehr nicht..und trotzdem wird sie im IE mit Fehlern angezeigt bzw. alles ist schepp...:-( in anderen Browsern ist sie perfekt. Wer mir beim Problem helfen kann hat was gut bei mir ich Dreh sonst noch durch. Danke

 

[bdt600]

Was glaubst du, können wir jetzt mit diesen Infos anfangen??? Wie wär's mit einem Link zur Seite?

 

[Cheffchen]

Hallo,

klein, nur für Handy? :O)

Ich tipp auf grundsätzliche HTML fehler, mach das Valide und dann schau weiter bzw ein Link für uns.

Auto Put mach heile, so ist deine Frage :O)

Cheffchen

 

[dune89]

Hier ein Ausschnitt meiner style.css

CSS DATEI:


a { font-size: 14px; font-family:"Verdana"; color:#A52A2A; text-decoration: none; line-height: 25px;}

#header { background-color: #ffffff; background-image: url(gegenmitesser.jpg); font-size: 1.2em; margin-top: 13px; width: 950px; height: 160px; border-radius: 10px 10px 0px 0px; }
#header h1{ font-size: 25px; color:#ffffff; padding-top: 50px; font-family:"arial"; }
#header h2{ font-size: 20px; color:#ffffff; padding-top: 50px; font-family:"arial";}
#header h3{ font-size: 38px; font-weight: normal; padding-left: 130px; padding-top: 30px; color:#5858FA; font-family:"arial";}
#header h4{ font-size: 15px; padding-left: 130px; padding-top: 25px; font-weight: normal; color:#000000; font-family:"arial";}
#header h5{ font-size: 20px; color: black; padding-top: 50px; font-weight: bold; font-family:"arial";}
#header h6{ font-size: 15px; color: #ffffff; padding-top: 30px; font-weight: bold; font-family:"arial"; text-align:center;}
#header p{ font-size: 12px; font-weight: bold; color:#4d4d4d; font-family:"arial";}


#nav { background-color:#000000; width: 950px; height: 30px; }

#startseite { font-weight: bold; padding-left: 65px; float: left; height:30px;}
#startseite a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#startseite a:link { color:#ebe9e9; }
#startseite a:visited { color:#ebe9e9; }
#startseite a:hover { text-decoration:none; color:#FFDAB9; background:; }
#startseite a:active { colorurple; }

#probleme { font-weight: bold; padding-left: 40px; float: left; height:30px; }
#probleme a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#probleme a:link { color:#ebe9e9; }
#probleme a:visited { color:#ebe9e9; }
#probleme a:hover { text-decoration:none; color:#FFDAB9; background:; }
#probleme a:active { colorurple; }

#gesichtspflege { font-weight: bold; padding-left: 40px; float: left; height:30px; }
#gesichtspflege a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#gesichtspflege a:link { color:#ebe9e9; }
#gesichtspflege a:visited { color:#ebe9e9; }
#gesichtspflege a:hover { text-decoration:none; color:#FFDAB9; background:; }
#gesichtspflege a:active { colorurple; }

#hautprobleme { font-weight: bold; padding-left: 40px; float: left; height:30px; }
#hautprobleme a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#hautprobleme a:link { color:#ebe9e9; }
#hautprobleme a:visited { color:#ebe9e9; }
#hautprobleme a:hover { text-decoration:none; color:#FFDAB9; background:; }
#hautprobleme a:active { colorurple; }

#hautcreme { font-weight: bold; padding-left: 40px; float: left; height:30px; }
#hautcreme a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#hautcreme a:link { color:#ebe9e9; }
#hautcreme a:visited { color:#ebe9e9; }
#hautcreme a:hover { text-decoration:none; color:#FFDAB9; background:; }
#hautcreme a:active { colorurple; }

#behandlungen { font-weight: bold; padding-left: 40px; float: left; height:30px; }
#behandlungen a{ font-size: 15px; font-family:"Verdana"; color:#ebe9e9; text-decoration: none; line-height: 25px;}
#behandlungen a:link { color:#ebe9e9; }
#behandlungen a:visited { color:#ebe9e9; }
#behandlungen a:hover { text-decoration:none; color:#FFDAB9; background:; }
#behandlungen a:active { colorurple; }


#main_content { font-weight: bold; float:left; width: 700px; height: 1200px; background-color:#ffffff; }
#main_content h1{ font-size: 25px; color:#4d4d4d; padding-top: 50px; font-family:"arial"; }
#main_content h2{ font-size: 25px; text-align: justify; color:#A52A2A; padding-top: 50px; padding-left: 20px; font-family: "arial"; font-variant: small-caps; }
#main_content h3{ font-size: 20px; text-align: justify; color:#5858FA; font-family:"arial"; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; font-variant: small-caps; }
#main_content h4{ font-size: 28px; font-weight: normal; color: #000000; padding-left: 20px; padding-right: 20px; font-family:"arial"; }
#main_content h5{ font-size: 20px; text-align: justify; color:#5858FA; font-family:"arial"; padding-left: 20px; padding-right: 20px; font-variant: small-caps; }
#main_content h6{ font-size: 15px; color: #4d4d4d; padding-top: 30px; font-weight: bold; font-family:"arial"; text-align:center;}
#main_content p{ font-size: 14px; text-align: justify; padding-top: 20px; padding-left: 20px; padding-right: 20px; font-weight: normal; color:#4d4d4d; font-family:"arial";}

#social_connection {float: left; width: 250px; height: 1200px; background-color: #ffffff; }


#footer { float:left; width: 100%; height: 200px; background-color:#000000; }
#footer h1{ font-size: 25px; color:#4d4d4d; padding-top: 50px; font-family:"arial"; }
#footer h2{ font-size: 20px; color:#4d4d4d; padding-top: 50px; font-family:"arial";}
#footer h3{ font-size: 20px; color:#4d4d4d; font-family:"arial";}
#footer h4{ font-size: 15px; font-weight: bolder; color:#4d4d4d; font-family:"arial";}
#footer h5{ font-size: 20px; color: black; padding-top: 50px; font-weight: bold; font-family:"arial";}
#footer h6{ font-size: 15px; color: #4d4d4d; padding-top: 30px; font-weight: bold; font-family:"arial"; text-align:center;}
#footer p{ font-size: 12px; font-weight: bold; color:#4d4d4d; font-family:"arial"; padding-left: 20px; padding-top: 170px; }

#impressum { padding-left: 20px; padding-top: 20px; float: left; height:30px; width: 120px;}
#impressum a{ font-size: 15px; font-family:"arial"; color:#ffffff; text-decoration: none; line-height: 25px;}
#impressum a:link { color:#ebe9e9; }
#impressum a:visited { color:#ebe9e9; }
#impressum a:hover { text-decoration:none; color:#9d96fe; background:; }
#impressum a:active { colorurple; }

 

[dune89]

INDEX.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"/>
<meta name="Description" content=""/>
<meta name="Keywords" content=""/>
<meta name="author" content=""/>
<meta name="ROBOTS" content="index,follow" />
<link href="style.css" type="text/css" rel="stylesheet" />

<title>TITEL</title>
</head>
<body>
<div id="header">


<h3>TEXT</h3>
<h4>TEXT</h4>

</div>

<div id="nav">

<div id="startseite">
<a href="/index.html">Startseite</a>
</div>

<div id="probleme">
<a href="/link#1</a>
</div>

<div id="gesichtspflege">
<a href="/link#2</a>
</div>

<div id="hautprobleme">
<a href="/link#3</a>
</div>

<div id="hautcreme">
<a href="/link#4</a>
</div>

<div id="behandlungen">
<a href="/link#5</a>
</div>

</div>

<div id="main_content">

<h2>TEXT</h2><br/>
<h3>TEXT</h3>

</div>

<div id="social_connection">

rechte Seite

</div>

<div id="footer">

<div id="impressum">
<a href="/impressum.html">Impressum</a>
</div>



</div>

</body>
</html>

 

[Cheffchen]

Hallo,

was sollen wir mit deinem css code, ausser das viel leere

background:; }

hast.
Ich tippe immer noch auf

Ich tipp auf grundsätzliche HTML fehler, mach das Valide und dann schau weiter bzw ein Link für uns.

ohne Link ist schwer zu helfen.

EDITE. oh seh gerade ich war zu schnell, html code hast ja nun eingefügt
Cheffchen

 

[dune89]

ok :) hoffentlich habt ihr ein überblick, den auf IE ist das main_content 2 mal zu sehen -.-

 

[bdt600]

Der HTML-Code ist kaputt, und das sogar heftig! Jede Menge Links sind völlig im Eimer!

PS: Es ist nicht nötig, dass du mir eine PM schreibst, damit ich in diesen Thread reinsehe.

 

[dune89]

wir reden nicht von den links, nur die struktur der seite ist wunderbar auf allen browsern.. außer im IE

 

[Cheffchen]

Hallo,

also wie @bdt600 schon sagt ist der HTML code fehlerhaft.
Bei links fehlt dir häfte
DU

<div id="probleme">
<a href="/link#1</a>
</div>

sollte aber

<div id="probleme">
<a href="/link#1[B]">[/B]</a>
</div>

und ein richtiges menü ist das auch nicht, Menü hat eine ul li liste zu sein.

Cheffchen

 

[bdt600]

wir reden nicht von den links

Doch, tun wir! Denn wenn die so kaputt sind, ist der restliche Aufbau purer Zufall.

 

[phzu]

Wenn er mich schon per Privatnachricht fragt, beantworte ich das mal.

1. Code posten in den vorgesehenen Tags. Macht das ganze uebersichtlicher.
2. Wenn du eine gute Hilfe erwartest, poste nur die relevanten Teile. Ich brauche nicht 100 verschiedene Farbformatierungen zu sehen.
3. Eine Navigation kommt in eine unsortierte Liste. (<ul>)
4. Einem einzelnen Link eine ID zuzuweisen halte ich persoenlich fuer nicht sehr hilfreich.
5. Du formatierst jeden Link in der Navigation einzeln. Wenn du eine <ul> verwendest, sprich die Links mit ul a {css...} an!

Zusammenfassend, vereinfache das Ganze! Das sind nicht mehr als circa 20 Zeilen in CSS....

EDIT: Es waren einige schneller. Beachte deren Tipps, auf die kaputten Links habe ich gar nicht geachtet.

 

[bdt600]

Wenn er mich schon per Privatnachricht fragt

Ach, dich auch? Was soll denn so ein Sch....???

 

[dune89]

egal danke schön trotzdem

 

[phzu]

Ach, dich auch? Was soll denn so ein Sch....???

Ja, wenn mir nicht grad langweilig waere, wuerde ich das nicht beantworten. Es lebe der Krankenstand -.-

 

[phzu]

Warum postest du nich von Anfang an den LINK?!?

gegen Mitesser - Erfahren Sie richtig, wie man Mitesser entfernen kann | gegenmitesser.de

 

[dune89]

hab die navi jetzt umgeändert, im IE immernoch schepp

 

[MrMurphy]

Hallo,

wo ist der Link zu der Seite?

Gruss

MrMurphy

 

[dune89]

oben steht er...

 

[phzu]

    <nav> 
        <ul>
            <a href="/index.html">Startseite</a> -
            <a href="/Mitesser/Mitesserprobleme/gegenmitesser.html">Mitesser</a> -
            <a href="/Gesicht/Gesichtspflege/gesichtspflege.html">Gesichtspflege</a> -
            <a href="/Hautpflege/Hautprobleme/unreinehaut.html">Hautprobleme</a> - 
            <a href="/Gutecreme/Hautcreme/creme.html">Hautcreme</a> -
            <a href="/Hautbehandlung/haut.html">Behandlungen</a>
        </ul> 
    </nav>

Jetzt noch alle Links in die <li> Tags, wie sichs gehoert und die Bindestriche weg, dann kann man mit der was anfangen.

Fuege dem nav{} im CSS ein display: block hinzu.