IE stellt Gallerie falsch dar

html.de-Forum HTML, XHTML & CSS
1

Erstmal ein liebes Hallo in die Runde :slight_smile:

Ich hoffe, ihr könnt mir helfen. Ich bin blutiger Anfänger in Sachen html/css und bin trotzdem mit großem Ehrgeiz dabei, mir die Materie selbst beizubringen und in meiner ersten eigenen HP umzusetzen. Mittlerweile bin ich jedoch an meine Grenzen gestoßen und finde auch weit und breit keine Lösung für mein Problem. Nun hoffe ich, hier Hilfe zu finden.

Nach tagelangem Abmühen habe ich nun meine Galerie so, wie ich sie haben möchte…total stolz über mein Ergebins wage ich einen Blick in den IE und bin fast vom Stuhl gekippt…da stimmt an der Darstellung rein gar nix mehr…die Thumbnails sind in alle verschoben und ich weiss nicht, wo ich anfangen soll, um den Fehler zu finden.

mein css:

body 
{
background:url("images/bg.jpg");
background-repeat:repeat;
background-color: #3A3A2F; 
font-size: 16px;
font-family: verdana, arial, helvetica, sans-serif;
color: #C1B77C;
margin: 0px auto;
height: 100%;
text-align: center;
}

#sitecontainer{
text-align: left;
width: 770px;
margin: auto;
z-index: 0;
top: 25px;
background-color:    #3A3A2F;
margin-top: 20px;
}

#header{
height:    134px;
width: 770px;
background-color:    #3A3A2F;
background:    url("images/header.jpg");
background-repeat: no-repeat;
}

#menue {
position: relative;
width: 770px;
height: 50px;
padding: 0;
background: #3A3A2F;
}

#nav {
position: absolute;
top: 0px;
list-style: none;
margin: 0;
padding: 0;
height: 50px;
display: inline;
overflow: hidden;
width: 780px;
}

#nav li {
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}

#nav a {
float: left;
padding: 50px 0 0 1px;
overflow: hidden;
height: 0px !important;
*height :20px; 
}

#home a  {
width: 152px;
background: url("images/home.jpg") top left no-repeat;
}
#home a:hover {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#nav #home a:active, #nav a.selected {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#about a  {
width: 157px;
background: url("images/about.jpg") top left no-repeat;
}
#about a:hover {
width: 157px;
background: url("images/about_over.jpg") top left no-repeat;
}

#nav #about a:active, #nav a.selected {
width: 157px;
background: url("images/about_over.jpg") top left no-repeat;
}

#art a  {
width: 152px;
background: url("images/home.jpg") top left no-repeat;
}

#art a:hover {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#nav #art a:active, #nav a.selected {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#guest a  {
width: 157px;
background: url("images/about.jpg") top left no-repeat;
}

#guest a:hover {
width: 157px;
background: url("images/about_over.jpg") top left no-repeat;
}

#nav #guest a:active, #nav a.selected {
width: 157px;
background: url("images/about_over.jpg") top left no-repeat;
}

#contact a  {
width: 152px;
background: url("images/home.jpg") top left no-repeat;
}

#contact a:hover {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#nav #contact a:active, #nav a.selected {
width: 152px;
background: url("images/home_over.jpg") top left no-repeat;
}

#bilder {
  width:auto;
  padding:5px;
  margin:20px 80px;
}
#bilder img {
  margin: 10px;
}

und hier das html:

[code]

…usw.

[/code]

Ich hoffe ich hab alles richtig gepostet und freu mich auf eure Hilfe.

Grüßli