Zum Inhalt springen

CSS, Template Mozilla OK, IE.x = ahhhhhhh

Erstellt am 10. März 2004 · 2 Antworten · letzte Antwort am 11. März 2004

Tags: HTML & CSS, Frage

denny ·

hi,

mir kommen langsam die Tränen. Es geht um die www.lippelt-back.com/index.php Seite. Genauer genommen um den rechten Teil. Der Rand soll genauso lang sein, das bei 1024x768 Auflösung kein Scrollbalken entsteht.

Im ersten Block soll ein Newsticker rein (der immer noch nicht richtig läuft), im unteren Teil eventuell ein Kalender. Das Problem ist, das beide Browser die Seite unterschiedlich anzeigen. Im Moz ist alles Center, während im IE scheinbar alles links angeordnet wird.
Außerdem ist der Rand im IE breiter.

Was auch nicht so recht will, ist die Schriftgröße und Farbe vom Newsticker. Wenn ich da was ändere, dann wird der >>*<< größer, die Schrift bleibt aber gleich.

Ich habe jetzt soviel im CSS rumgeschreibt, das ich den Überblick verloren habe :-(

Hier mal der Code:

body {
        height: 100%;
        padding: 0;
        color: #000000;
        background-color: #ffffff;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 10px;
        text-decoration: none;
        padding: 10px;
        margin : 0 0 0 0;

}


body {
height: 100%;
margin:0;
padding:0;
}

a { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:10pt; font-weight:580; text-decoration:none; }


h1 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 8pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h2 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 10pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h3 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h4 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

#mainTable {
        width: 760px;
        border-left: 10px;
        color: #000000;
        background-color: E9E9E9;

 }


#mainContent {
        width: 500px;
        height: 470px;
        font-size: 12px;
        color: #000000;
        padding-left: 10px;
        font-family: Arial;
        vertical-align: top;
        background-color: #E9E9E9;
        border-left: 10px;
}


table {

        border-collapse: separate;
        border-spacing: 2px;
        border-style: none;
}





#sidebar {
        width: 200px;
        height: 470px;
        vertical-align: top;
        text-align: left;
        font-size: 12px;
        color: #000000;
        background-color: #E9E9E9;
 }

#border {
        width: 150px;
        height: 140px;
        font-size: 10px;
        color: #FFFFFF;
        text-align: center;
        vertical-align: top;
        background-color: #FD1613;
 }

#newsticker {
        width: 150px;
        height: 240px;
        font-size: 10px;
        color: #FFFFFF;
        text-align: center;
        vertical-align: top;
        background-color: #FD1613;
 }

#infoNavi {
        background-color: #FD1613;
        color: white;
        width: 150px;
        height: 27px;
        font-size: 20px;
        text-align: center;
        text-decoration: none;
 }

#logoright {
        background-color: #FD1613;
        color: white;
        text-align: center;
        width: 150px;
        height: 66px;
        font-size: 12px;
 }

 #logoleft {
        background-color: #FD1613;
        color: white;
        text-align: center;
        width: 190px;
        height: 66px;
        font-size: 12px;

 }

#emtyleftOben {
        color: white;
        width: 185px;
        height: 27px;
        font-size: 12px;
 }

#emtyleftUnten {
        color: white;
        width: 185px;
        height: 25px;
        font-size: 12px;
        background-color: #E9E9E9;
 }

#emtyrightUnten {
        width: 150px;
        height: 25px;
        font-size: 12px;
        color: white;
        background-color: #FD1613;
 }

#header {
        color: white;
        background-color: #FD1613;
        height: 50px;
        color: #CCCCCC;
 }

#footer {
        color: #000000;
        background-color: #E9E9E9;
        font-size: xx-small;
        height: 25px;
        vertical-align: baseline;
        text-align: center;
 }

Mein Template findet ihr unter:

http://lippelt-back.com/fileadmin/vorlagen/lippelt/test4.htm

Habt ihr eine Idee, wie ich die Probs beheben kann?

denny ·

hi,

ich habe meine CSS nochmal verändert, breite passt jetzt so halb, aber beim Moz. habe ich einen Scrollbalken:

body {
        height: 100%;
        padding: 0;
        color: #000000;
        background-color: #ffffff;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 10px;
        text-decoration: none;
        padding: 5px;
        margin : 0 0 0 0;

}


body {
height: 100%;
margin:0;
padding:0;
}

a { font-family:Verdana,Arial,Helvetica,sans-serif; font-size:10pt; font-weight:580; text-decoration:none; }


h1 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 8pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h2 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 10pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h3 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

h4 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14pt;
color: #FD1613;
font-weight: bolder;
font-style: normal;
text-decoration: none;
margin-bottom: -1px;
}

#mainTable {
        width: 760px;
        border-left: 10px;
        color: #000000;
        background-color: E9E9E9;

 }


#mainContent {
        width: 500px;
        height: 470px;
        font-size: 12px;
        color: #000000;
        padding-left: 10px;
        font-family: Arial;
        vertical-align: top;
        background-color: #E9E9E9;
        border-left: 10px;
}


table {

        border-collapse: separate;
        border-spacing: 2px;
        border-style: none;
}





#sidebar {
        width: 200px;
        height: 470px;
        vertical-align: top;
        text-align: left;
        font-size: 12px;
        color: #000000;
        background-color: #E9E9E9;
 }

#border {
        width: 181px;
        height: 90px;
        font-size: 8px;
        color: #FFFFFF;
        text-align: center;
        vertical-align: top;
        background-color: #FD1613;

 }

#newsticker {
        width: 181px;
        height: 80px;
        font-size: 6px;
        color: #FFFFFF;
        text-align: left;
        vertical-align: top;
        background-color: #FD1613;
        border-style: outset;
 }
#newsticker  a { color:#FFFFFF; }
#newsticker  a:hover { color:#000000; text-decoration:bold;}



#infoNavi {
        background-color: #FD1613;
        color: white;
        width: 181px;
        height: 27px;
        font-size: 20px;
        text-align: center;
        text-decoration: none;
 }

#infoNavi a { color:#FFFFFF; }
#infoNavi a:hover { color:#000000; text-decoration:bold;}
#infoNavi a:visited { color:#000000; text-decoration:bold;}
#infoNavi a:active { color:#000000; text-decoration:bold;}

#logoright {
        background-color: #FD1613;
        color: white;
        text-align: center;
        width: 181px;
        height: 66px;
        font-size: 12px;
 }

 #logoleft {
        background-color: #FD1613;
        color: white;
        text-align: center;
        width: 190px;
        height: 66px;
        font-size: 12px;

 }

#emtyleftOben {
        color: white;
        width: 185px;
        height: 20px;
        font-size: 12px;
 }

#emtyleftUnten {
        color: white;
        width: 185px;
        height: 20px;
        font-size: 12px;
        background-color: #E9E9E9;
 }

#emtyrightUnten {
        width: 181px;
        height: 20px;
        font-size: 12px;
        color: white;
        background-color: #FD1613;
 }

#emtyrightUnten  a { color:#FFFFFF; }
#emtyrightUnten  a:hover { color:#000000; text-decoration:bold;}


#header {
        color: white;
        background-color: #FD1613;
        height: 50px;
        color: #CCCCCC;
 }

#footer {
        color: #000000;
        background-color: #E9E9E9;
        font-size: xx-small;
        height: 20px;
        vertical-align: baseline;
        text-align: center;
 }