Probleme bei Darstellung mit IE 7 und Mozilla 2
Christian
- css
Hallo zusammen,
nachdem ich nun lange Zeit an einer vorgefertigten Homepage (sog. Template) herumgebastelt habe um für unseren Verein eine schöne Internetpräsenz zu gestalten, muss ich feststellen, dass die Darstellung einzelner Browser extrem voneinander abweicht. Im IE 6 und Mozilla 1.5 sieht alles perfekt aus, allerdings sieht dies bei IE 7 und Mozilla 2 ganz anders aus. Die Breite der Homepage wird verändert, sodass dadurch einiges zusammengestaucht wird. Außerdem gravierend ist die Darstellung im IE 7, da ist alles nach oben verschoben. Das konnte ich zumindest teilweise dadurch lösen, dass ich folgendes im html Code geändert habe: http://www.w3.org/TR/xhtml1/DTD/html4.loose.dtd"
Vorher stand da: http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
Bevor ich hier noch länger erzähle (vielleicht kennt jemand bereits das Problem) möchte ich euch noch einen link zur Homepage und die CSS Datei anhängen. Es wäre schön, wenn jemand kurz Zeit hat sich das anzuschauen.
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
* {
margin: 0;
padding: 0;
}
body {
background: #FFFFFF url('images/img01.gif') repeat-x;
color: #999999; font-style:normal; font-variant:normal; font-weight:normal; font-size:small; font-family:Arial, Helvetica, sans-serif
}
form {
}
fieldset {
border: none;
}
legend {
display: none;
}
h1, h2, h3, h4 {
margin: 0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight: normal;
color: #0066ff;
}
h2 {
margin-bottom: .5em;
font-size: 1.8em;
}
h3 {
margin-bottom: 0em;
font-size: 1.5em;
}
h4 {
margin-bottom: 0em;
font-size: 1.2em;
font-weight: bold;
}
p, blockquote, ul, ol {
margin-bottom: 1.5em;
line-height: 1.8em;
}
p {
}
blockquote {
margin-left: 3em;
font-style: italic;
}
ul {
margin-left: 2em;
list-style: square;
}
ul li {
}
ol {
margin-left: 2em;
list-style: lower-alpha;
}
ol li {
}
a {
color: #0066ff;
}
a:hover {
text-decoration: none;
color: #99b2ff;
}
img {
border: none;
}
img.left {
float: left;
margin: 0 1em 1em 0;
}
img.right {
float: left;
margin: 0 1em 1em 0;
}
/* Boxed Style */
.boxed {
margin-bottom: 1em;
background: #FFFFFF;
border: 1px solid #CAD4DF;
}
.boxed .title {
padding: 10px 0 0 10px;
text-transform: uppercase;
font-size: 1em;
font-weight: bold;
}
.boxed .content {
padding: 10px;
}
/* Header */
#header {
width: 700px;
min-height: 252px;
margin: 0 auto;
}
/* Header > Logo */
}
#logo h1 {
padding: 110px 0 0 0;
text-transform: uppercase;
font-size: 3em;
}
#logo h2 {
margin: 0;
padding: 5px 0 0 100px;
text-transform: uppercase;
font-size: 1.6em;
}
#logo a {
text-decoration: none;
color: #385B88;
}
/* Header > Top Menu */
#topmenu {
float: left;
margin: 0 -4px 0 0;
}
#topmenu ul {
margin: 0;
list-style: none;
}
#topmenu li {
display: inline
}
#topmenu a {
display: block;
float: left;
min-height: 34px;
}
#topmenu a:hover {
}
#topmenu span {
display: none;
}
/* Menu */
#menu {
width: 700px;
min-height: 20px;
margin: -40px auto 0 auto;
padding: 0 0 0 0;
}
#menu ul {
margin: 0;
list-style: none;
line-height: normal;
}
#menu li {
display: inline;
}
#menu a {
display: block;
float: left;
padding: 0 2.3em 0 0;
text-transform: uppercase;
text-decoration: none;
font-size: .8em;
font-weight: bold;
}
#menu a:hover {
text-decoration: underline;
}
#menu .first a {
padding-left: 0;
background: none;
}
/* Content */
#content {
width: 700px;
margin: 0 auto;
padding: 20px 0;
}
/* Content > Main */
#main {
float: left;
width: 460px;
}
/* Content > Main > Example */
#example {
}
/* Content > Main > Welcome */
#welcome {
margin: 0 0 3em 0;
padding: 40px 0 1.5em 0;
}
/* Content > Sidebar */
#sidebar {
float: right;
width: 220px;
margin: 15px 0 0 0;
}
/* Content > Sidebar > News*/
#News {
}
#News ul {
margin: 0;
list-style: none;
}
#News li {
margin-bottom: 1em;
}
#News h3 {
margin: 0;
padding: 0 0 0 10px;
font-size: x-small;
}
#News p {
margin: 0;
padding: 0 0 0 10px;
line-height: normal;
font-size: .85em;
}
#News a {
text-decoration: none;
}
/* Content > Sidebar > Partners*/
#partners {
}
/* Footer */
#footer {
clear: both;
padding: 15px 0 15px 0;
background: #C3CDDB;
border: 1px solid #CAD4DF;
}
#footer p {
width: 700px;
margin: 0 auto;
font-size: x-small;
}
Die Homepage lautet: www.uni-giessen.de/akb
Vielen Dank schonmal für eure Antworten!!
Gruß,
Christian