Hallo zusammen
Bin neu hier. Versuche möglichst, allen geschriebenen und ungeschriebenen Forenregeln gerecht zu werden. 
Ich bastle an meiner eigenen Website und eigne mir dabei erste CSS-Kenntnisse an.
Auf dieser Seite habe ich die Highslide Gallery eingebunden:
http://spielwiese.jumpman23.ch/foto.htm
Im Firefox präsentiert sich mir alles wünderschön wie es sein sollte, nämlich so:
[Blockierte Grafik: http://i79.photobucket.com/albums/j122/At…ous/foto_ff.jpg]
Im IE schrumpft es mir die Thumbnail-Ansicht jedoch übelst zusammen:
[Blockierte Grafik: http://i79.photobucket.com/albums/j122/At…ous/foto_ie.jpg]
Woher könnte dieser unschöne Effekt wohl kommen und vor allem, wie bringe ich das denn richtig hin?
Zähle auf eure Hilfe! Danke schön!
Hier noch der html-Code der Seite:
HTML
<html>
<head>
<title>spielwiese</title>
<base target="_self">
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="highslide/highslide-with-gallery.js"></script>
<script type="text/javascript" src="highslide/highslide.config.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="highslide/highslide.css" />
</head>
<body>
<div id="hauptdiv"; style="position: absolute; width:780px; height:624px; top:50%; left:50%; margin-left:-390px; margin-top:-312px;">
<div class="highslide-gallery" style="position:absolute; left:65px; top:93px; width:650px;">
<ul>
<li>
<a href="foto/DSC04002.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04002_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04014.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04014_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04015.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04015_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04021.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04021_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04078.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04078_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04079.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04079_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04194.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04194_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04198.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04198_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04292.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04292_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04293.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04293_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04298.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04298_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04371.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04371_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04450.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04450_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04453.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04453_th.jpg" alt=""/>
</a>
</li>
<li>
<a href="foto/DSC04455.jpg" class="highslide"
onclick="return hs.expand(this, config1 )">
<img src="foto/DSC04455_th.jpg" alt=""/>
</a>
</li>
</ul>
<div style="clear:both"></div></div>
<table id="menue" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="25%">
<p align="center"><a class="menuelink" href="index.htm"><font size="5">start</font></a></td>
<td width="25%">
<p align="center"><a class="menuelink" id="linkaktiv" href="foto.htm"><font size="5">foto</font></a></td>
<td width="25%">
<p align="center"><a class="menuelink" href="audio.htm"><font size="5">audio</font></a></td>
<td width="25%">
<p align="center"><a class="menuelink" href="video.htm"><font size="5">video</font></a></td>
</tr>
</table>
</body>
</html>
Und hier mein CSS-File:
Code
body {
background: #000000;
}
p {
font-family: verdana, arial, sans-serif;
font-size: 15px;
color: #999999;
}
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:visited {
color: #FFFFFF;
text-decoration: none;
}
a:active {
color: #FFFFFF;
text-decoration: none;
}
a:hover {
color: #FFFFFF;
text-decoration: none;
}
.menuelink:link {
color: #FFFFFF;
background: #000000;
display: block;
width: 93%;
}
.menuelink:visited {
color: #FFFFFF;
background: #000000;
display: block;
width: 93%;
}
.menuelink:active {
color: #FFFFFF;
background: #262626;
display: block;
width: 93%;
}
.menuelink:hover {
color: #FFFFFF;
background: #1A1A1A;
display: block;
width: 93%;
}
.menuelink {
text-decoration: none;
}
#linkaktiv {
color: #FFFFFF;
background: #262626;
display: block;
width: 93%;
}
#linkaktiv:hover {
color: #FFFFFF;
background: #1A1A1A;
display: block;
width: 93%;
}
#hauptdiv {
background-image: url(gfx_frame.jpg);
background-repeat: no-repeat;
background-position: 50% 0%;
}
#menue {
position:absolute;
left: 0px;
bottom: 0px;
Falls mehr Infos benötigt, einfach sagen.
