• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

<div> im IE zu groß

FaFoo

FaFoo

New member
Hi,

Es gibt mal wieder ein Problem mit dem IE. Ich habe auch schon die Suchfunktion benutzt aber nichts gefunden was mir wirklich weiterhelfen konnte. :/

In einer Menübox trenne in die einzelnen untereinanderstehenden Links durch eine Grafik die ich in einem <div> als Hintergrund eingebunden habe. Die Grafik ist 7px hoch, dem <div> habe ich somit auch diese Höhe zugewiesen. Im Internet Explorer ist das div aber viel zu hoch und die Grafik wird wiederholt, es sei denn ich verhindere das Wiederholen in der css-Datei.

Anschauen könnt ihrs euch hier:
(der Webspace ist z.Z. sehr langsam, sry)

Kumbaya

Würd mich freuen wenn jemand weiterhilft. Smile

Hier der Quelltext:

index.html
PHP: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<!--====================-->

<head>
<title>Kumbaya</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>

<!--====================-->

<body>

<!------------------------>

<div id="navi1">
    <div class="link1"><a href="">Menüpunkt</a></div>
    <div class="link1"><a href="">Menüpunkt</a></div>
    <div class="link1aktivbgl"></div>
    <div class="link1aktiv"><a href="">Menüpunkt</a></div>
    <div class="link1aktivbgr"></div>
    <div class="link1"><a href="">Menüpunkt</a></div>
    <div class="link1"><a href="">Menüpunkt</a></div>
</div>

<!------------------------>

<div id="content">
   <div style="height:15px;"></div>
   <div id="navi2">
      <div class="navi2oben"></div>
      <div class="link2"><a href="">Menüpunkt</a></div>
       <div class="navi2trenner"></div>
      <div class="link2"><a href="">Menüpunkt</a></div>
       <div class="navi2trenner"></div>
      <div class="link2"><a href="">Menüpunkt</a></div>
       <div class="navi2trenner"></div>
      <div class="link2"><a href="">Menüpunkt</a></div>
       <div class="navi2trenner"></div>
      <div class="link2"><a href="">Menüpunkt</a></div>
      <div class="navi2unten"></div>
   </div>
   <div style="height:15px;"></div>
</div>
</body>
</html>

style.css
Code: 
#navi1 {
width:               793px;
height:               28px;
max-height:            28px;
background-image:      url("img/navi1bg.gif");
}

.link1 {
float:               left;
height:               28px;
padding-top:         5px;
}

.link1 a {
color:               #DD0000;
font-family:         Microsoft Sans Serif;
font-size:            12px;
text-decoration:      none;
padding-left:         5px;
padding-right:         5px;
}

.link1 a:hover {
background-color:      #DDAA00;
padding-bottom:         3px;
}

.link1aktiv {
float:               left;
height:               28px;
padding-left:         5px;
padding-right:         5px;
line-height:         2.1;
background-image:      url("img/link1aktivbg.gif");
}

.link1aktiv a{
color:               #DD0000;
font-family:         Microsoft Sans Serif;
font-size:            12px;
text-decoration:      none;
}

.link1aktivbgl {
width:               1px;
height:               28px;
background-image:      url('img/link1aktivbgr.gif');
float:left;
}

.link1aktivbgr {
width:               2px;
height:               28px;
background-image:      url('img/link1aktivbgr.gif');
float:left;
}

#content {
width:               793px;
background-color:      #DDAA00;
}

#navi2 {
width:               133px;
margin-left:          5px;
background-color:      #DDDD00;
}

.navi2oben {
width:               133px;
height:               32px;
background-image:      url("img/navi2oben.gif");
}

.navi2unten {
width:               133px;
height:               32px;
background-image:      url("img/navi2unten.gif");
}

.navi2trenner {
width:               133px;
height:               7px;
background-image:      url("img/navi2trenner.gif");
background-repeat:      no-repeat;
}

.link2 {
height:               28px;
padding-right:         8px;
text-align:            right;
background-image:      url("img/navi2bg.gif");
}

.link2 a {
color:               #DD0000;
font-family:         Microsoft Sans Serif;
font-size:            12px;
text-decoration:      none;
padding-left:         5px;
padding-right:         5px;
}
.link2 a:hover {
background-color:      #DDAA00;
}
 
Schuldigung, hatte aber auch vorher gesucht in mehreren Foren nur nicht genau das gefunden was mir weiterhilft. Aber danke, ich les es mir gleich durch.
 
[Noch mehr OT]Immerhin ist <html> nicht in einem div. :)[/Noch mehr OT]
 
ohne mir das lange anzuschauen, das Erste was du ändern solltest, dem Dokument einen DOCTYPE spendieren, damit die Seit nicht im Quirksmode angezeigt wird.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben