mp1111: andere Schriftformatierung in Firefox als im IE

Beitrag lesen

Hi
Ich habe das Problem, dass ich mit dem Scriptlx-Editor immer mit der IE-Vorschau geprüft habe, ob die Formatierung so ist, wie ich sie haben möchte. Jetzt habe ich die Datei im Firefox geöffnet und die Formatierung des Textes ist anders und ich weiß nicht, woran das liegt.

Im Anhang die Screenshots in den Browsern

hier der HTML-Code~~~html !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

<html lang="de">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="keywords" content="Ingeniuerb&uuml;ro Tragwerk Bauphysik Hans-Adolf Kurth Diplom-Ingeniur Bauwesen">
    <meta name="description" content="Ingeniuerb&uuml;ro f&uuml;r Bauphysik und Tragwerksplanung Hans-Adolf Kurth Diplom-Ingeniur f&uuml;r Bauwesen">
    <meta http-equiv="content-language" content="de">

<title>Kontakt</title>
    <link rel="stylesheet" type="text/css" href="formate.css">
    <link href="favicon.ico" type="image/x-ion" rel="shortcut icon">
</head>

<body>
    <div id="kopfzeile">
    <div id="kopfbild"><img src="bilder/HAKmittel.jpg" align="left" height="245" width="265" alt="Firmensymbol HAK">
    </div>
    <div id="headline">
            <h1 class="header" id="kopf_erste_zeile"><a><font size="5em">Ingenieurb&uuml;ro f&uuml;r Tragwerksplanung u. Bauphysik</font></a></h1>

<h1 class="header"><font size="6em"><font size="5em">Dipl.-Ing.</font> Hans-Adolf KURTH</font></h1>

<h1 class="header"><font size="4em">Diplom-Ingenieur f&uuml;r Bauwesen</font></h1>

<h1 class="header" id="kopf_letzte_zeile"><font size="5em">Am Sch&uuml;tzenplatz 2 &bull; 37434 GIEBOLDEHAUSEN</font></h1>
</div>
    </div>

<div id="container">
        <div id="sidebar1">
            <ul class="nav">
                <li><a href="../hansadolf_kurth_versuch1.html">Startseite</a></li>

<li><a href="preise.html">Unsere Preise</a></li>

<li><a href="bilder.html">Bilder von Projekten</a></li>

<li><a href="gaestebuch.html">G&auml;stebuch u. Forum</a></li>

<li><a href="kontakt.html">Kontakt</a></li>

<li><a class="unterpunkt" href="#anfahrtsskizze">&nbsp;&nbsp;Anfahrtsskizzen</a></li>
            </ul><!-- <li><script src=".php"></script>   </li> nicht eingebunden -->
        </div>

<div id="content">
            <h1>Kontakt</h1>

<p class="adressblock">Ingenieurb&uuml;ro f&uuml;r Tragwerksplanung und Bauphysik</p>

<p class="adressblock">Dipl. Ing. Hans-Adolf Kurth</p>

<p class="adressblock">Diplom-Ingenieur f&uuml;r Bauwesen</p>

<p class="adressblock">Am Sch&uuml;tzenplatz 2</p>

<p></p>

<p class="adressblock">37434 Gieboldehausen</p>

<p></p>

<p>Termin nach Absprache</p><!-- Richtige E-Mail-Adresse? -->

<p></p><a href="mailto:mail@h-a-k.de">E-Mail an mich (ein E-Mail-Programm muss sich hierf&uuml;r auf Ihrem Rechner befinden)</a>

<p></p><a name="anfahrtsskizzen" id="anfahrtsskizzen"></a>

<h2>Anfahrtsskizzen</h2>

<p></p>
            <img src="bilder/anfahrt_weit.jpg" height="590" width="790" alt="S&uuml;d-West-Niedersachsen">

<p></p><img src="bilder/anfahrt_mittel.jpg" height="590" width="790" alt="Karte von S&uuml;dniedersachsen">

<p></p><img src="bilder/anfahrt_nah.jpg" height="590" width="790" alt="Karte von Gieboldehausen">

<p></p>

<h2>Wegbeschreibung</h2>

</div>
    </div>
</body>
</html>

  
der CSS-Code  
~~~css
h1 {  
background-color:#CCFFCC;  
font-size:36px;  
margin-left:10px;  
margin-top:-10px;  
}  
  
#einleitung {  
background-color:#00CC66;  
border:#FFFFFF;  
color:#333300;  
margin-bottom:0;  
margin-top:0;  
}  
  
ul {  
color:#CC3300;  
}  
  
ol {  
background:#00CC66;  
color:#660000;  
}  
  
p .right {  
text-align:right;  
}  
  
body {  
background-color:#000000;  
color:#330066;  
font:100%/1.4 Verdana, Arial, Helvetica, sans-serif;  
margin:0;  
padding:0;  
text-align:center;  
}  
  
ul,ol,dl {  
margin:0;  
padding:0;  
}  
  
h2,h3,h4,h5,h6,p {  
margin-top:0;  
padding-left:15px;  
padding-right:15px;  
}  
  
a img {  
border:none;  
}  
  
a:link {  
color:#42413C;  
text-decoration:underline;  
}  
  
a:visited {  
color:#6E6C64;  
text-decoration:underline;  
}  
  
a:hover,a:active,a:focus {  
text-decoration:none;  
}  
#container,#kopfzeile{  
width: 1240px;  
}  
  
#container,#sidebar1,#content {  
min-height: 700px;  
text-align: left;  
margin:0px;  
padding:0px;  
}  
  
  
#kopfzeile {  
height:245px;  
background-color:#CCFFCC;  
border:#3300CC;  
border: none;  
border-bottom: double;  
border-spacing:4px;  
margin: 0px;  
padding: 0px;  
text-align: center;  
margin-top: 0;  
margin-bottom: 0;  
}  
#kopfbild,#headline,#obenrechts{  
    height: 245px;  
}  
#kopfbild{  
    float: left;  
    width: 265px;  
}  
#headline,#content{  
    width: 736px;  
}  
  
#headline {  
background-color:#CCFFCC;  
color:#3300CC;  
margin:0px;  
padding:0px;  
float:left;  
border:#3300CC;  
font-size: 100.1%;  
text-align: center;  
}  
  
.header {  
margin-bottom:0;  
margin-top:0;  
text-align:center;  
}  
#kopf_erste_zeile{  
    padding-top: 1em;  
}  
#kopf_letzte_zeile{  
    padding-bottom: 1em;  
}  
  
#container {  
background-color:#CCFFCC;  
background-image:url(images/tue-farbverlauf-steuerung-bsp.gif);  
margin:0 auto;  
min-height:707px;  
overflow:hidden;  
text-align:left;  
}  
  
#sidebar1 {  
float:left;  
padding-bottom:10px;  
padding-top:10px;  
width:240px;  
}  
  
.nav_para {  
background:#C6D580;  
display:block;  
padding:5px 5px 5px 15px;  
width:225px;  
}  
  
.unterpunkt{  
  
}  
  
#content {  
background-color:#CCFFCC;  
float:left;  
margin-left:24px;  
padding:10px 0;  
padding-top: 10px;  
width:736px;  
}  
  
.adressblock {  
font-style:normal;  
font-size:medium;  
margin:0;  
}  
  
#content ul,#content ol {  
background-color:#33FF66;  
padding:0 15px 15px 40px;  
}  
  
ul.nav {  
border-top:1px solid #666666;  
list-style:none;  
margin-bottom:15px;  
}  
  
ul.nav li {  
border-bottom:1px solid #666666;  
}  
  
ul.nav a,ul.nav a:visited {  
background:#C6D580;  
display:block;  
padding:5px 5px 5px 15px;  
text-decoration:none;  
width:225px;  
}  
  
ul.nav a:hover,ul.nav a:active,ul.nav a:focus {  
background:#ADB96E;  
color:#FFFFFF;  
}  
  
/*Kantenabrundung versch. Browser (auf css 2.1 beruhend; wenn css3 standart: reicht border-radius..)*/  
h1,ul,ol,body {  
border-radius:4px;  
-khtml-border-radius:4px;  
-webkit-border-radius:4px;  
-o-border-radius:4px;  
-moz-border-radius:4px;  
}  
  
#einleitung {  
border-bottom-left-radius:0;  
-moz-border-bottom-left-radius:0;  
-khtml-border-bottom-left-radius:0;  
-webkit-border-bottom-left-radius:0;  
-o-border-bottom-left-radius:0;  
border-bottom-right-radius:0;  
-moz-border-bottom-right-radius:0;  
-khtml-border-bottom-right-radius:0;  
-webkit-border-bottom-right-radius:0;  
-o-border-bottom-right-radius:0;  
border-top-left-radius:6px;  
-moz-border-top-left-radius:6px;  
-webkit-border-top-left-radius:6px;  
-o-border-top-left-radius:6px;  
-khtml-border-top-left-radius:6px;  
border-top-right-radius:6px;  
-webkit-border-top-right-radius:6px;  
-o-border-top-right-radius:6px;  
-khtml-border-top-right-radius:6px;  
-moz-border-top-right-radius:6px;  
}  
  
.nav_param,ul.nav a,ul.nav a:visited {  
border-bottom-right-radius:5px;  
-webkit-border-bottom-right-radius:5px;  
-o-border-bottom-right-radius:5px;  
-khtml-border-bottom-right-radius:5px;  
-moz-border-bottom-right-radius:5px;  
border-top-right-radius:5px;  
-webkit-border-top-right-radius:5px;  
-o-border-top-right-radius:5px;  
-khtml-border-top-right-radius:5px;  
-moz-border-top-right-radius:5px;  
}

Anzeige in der IE-Vorschau im Scriptly-Editor

Anzeige im Firefox 4.01

Weiß jemand, woran das liegen kann. Danke im Vorraus für die Antworten