• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Navigation verschiebt sich...

G

Geri345

Neues Mitglied
Hallo,

ich habe das problem, dass sich die navi bei genau einem menüpunkt komplett verschiebt:

Hotel Gungau

bei allen anderen menüpunkten bleibt sie normal. daher denke ich, dass es ein css-fehler in der verlinkten seite oder in der php-datei selbst was schiefgelaufen ist.
bin schon seit tagen am suchen, finde jedoch nichts...
bitte helft mir ^^

hier die codes der php und der css datei:


fotogalerie.php
PHP: 
<span class="ue">Fotogallerie</span><br />
<br />
<?php
if(isset($_GET["kat"])) {
if(isset($_GET["beginn"])) $beginn = $_GET["beginn"];
else $beginn = 1;
$anzahl = 12;
$next = $beginn + $anzahl;
$zaehler = 0;
$zaehler2 = 0;
$bilderanzahl = 0;
$galgetZ = $_GET["kat"];
echo '<span><strong>'.$galgetZ.'</strong></span>&nbsp;&nbsp;&raquo; <a href="index.php?page=fotogalerie" " style="font-weight: bold; font-size: 11px;"><span style="color:#444;">Zur&uuml;ck zur &Uuml;bersichtsseite</span></a> &laquo;<br><br>';
$pfadZ = ('../../../img/fotoarchiv/').$galgetZ.'/';
$verzZ = opendir($pfadZ); 
//reset($verz);
$verzeichnisseZ = array();
while($verz2Z = readdir($verzZ)){ 
 if (($verz2Z != ".") && ($verz2Z != "..") && ($verz2Z != "Thumbs.db")){
     array_push($verzeichnisseZ, $verz2Z);
  $bilderanzahl++;
 }
}
$verzecihnisseZ = natsort ($verzeichnisseZ);
foreach ($verzeichnisseZ as $vZ) {
 $zaehler2++;
 if($beginn < $next && $zaehler2 >= $beginn) {
  echo '<div class="gallery"><div class="img6">
   <a href="'.$pfadZ.''.$vZ.'" rel="lightbox[galerie]" title="'.$galgetZ.'">
   <img src="'.$pfadZ.''.$vZ.'" border="3" style="border-color: #ffffff;" width="160px" height="100px"/></a>
   </div></div>';
  $beginn++;
  $zaehler++;
 }
}
echo '<div style="clear:both"></div>';
if($bilderanzahl > $next) echo '<div align="right"><a href="index.php?page=fotogalerie&amp;kat='.$galgetZ.'&amp;beginn='.$next.'" style="font-weight: bold; font-size: 11px;"><span style="color:#444;">N&auml;chste Seite &raquo;</a></div>';

closedir($verzZ);
echo '<div style="clear:both"></div>';
} else {
$i = 0;
$directory = opendir('../../../img/fotoarchiv/');
while($dir = readdir($directory)) { 
 if($dir != "." && $dir != ".." &&  !is_dir($dir)) {
  $dir_1[$i] = $dir;
  $i++;
 } 
}
$i = 0;
while(count($dir_1) > $i) {
 $ue = true;
 $pfad = ('../../../img/fotoarchiv/').$dir_1[$i].'/'; //Verzeichnis auslesen
 $verz = opendir($pfad);     //in Pfad konvertieren
 $anzahlperorder = 0;
 while($file = readdir($verz)) {
  $info = @getimagesize($file);   
  if($file != "." && $file != ".." &&  !is_dir($file) && $file != "Thumbs.db") { 
   if($ue == true) {
    $img[$i] .= '';
    $img[$i] .= '<span style="font-weight: bold; font-size: 11px;">'.$dir_1[$i].'</span><br><br>';
    $ue = false;
   }
   $anzahlperorder++;
   if($anzahlperorder <= 4) {
    $img[$i] .= '
     <div class="gallery"><div class="img6">
      <a href="'.$pfad.''.$file.'" rel="lightbox['.$verz.']" title="'.$dir_1[$i].'">
      <img src="'.$pfad.''.$file.'" border="3" style="border-color: #ffffff;" width="160px" height="100px"/></a>
     </div></div>
    ';
   } else {
    if($anzahlperorder < 6) {
     $img[$i] .= '
      <div style="clear:both"></div>
      <div class="img66" style="padding-top: 10px; float:left;">
       <a href="index.php?page=fotogalerie&amp;kat='.$dir_1[$i].'" title="'.$dir_1[$i].'" style="font-weight: bold; font-size: 11px;"><span style="color:#444;">&raquo; Alle Fotos aus dieser Kategorie anzeigen</span></a>
      </div>
     ';
     $mehr = 1;
    }
   }
  }
 } 
 if($mehr == 1) $img[$i] .= '<div style="clear:both"></div><br />';
 else $img[$i] .= '<div style="clear:both"></div><br /><br />';
 closedir($verz);
 echo $img[$i];
 $i++;
}
}
?> 
</div>
</div>
<div style="clear:both;"> </div>
<br />

index.css
Code: 
body {
   margin: 0;
   padding: 0;
   font-family: Geneva, Arial, Helvetica, sans-serif;
   font-size: 11px;
   overflow: hidden;
   background-color: #FFFFFF;
  }
#main {
   position: relative;
   text-align: left;
   margin-top: 10px;
   width: 851px;
   height: 283px;
  }
  
#wrap {
   position: absolute;
   margin-left: 0px;
   margin-top: 0px;
   width: 100%;
   height: 100%;
   background-image: url(../img/big_bg_2.png);
   background-repeat: no-repeat;
   z-index: 1;
  }
  
#website {
 position: absolute;
 text-align: center;
 width: 100%;
 height: 100%;
 overflow: auto;
 z-index: 100;
 background-image: url(../img/big_bg.jpg);
 background-repeat: no-repeat;
 top: -2px;
 left: -12px;
   }
  
#txt {
   font-size: 11px; 
  }
  
#txt a {
   color: #333333;
   text-decoration: none;
  }
  
#txt a:hover {
     text-decoration: underline;
    }
  
#impressum {
    position: absolute;
    margin-left: 50px;
    margin-top: 115px;
   }
   
#impressum a {
     font-size: 11px;
     color: white;
     text-decoration: none;
     font-weight: bold;
    }
    
#impressum a:hover {
      text-decoration: underline;
     }
  
#left {
   position: absolute;
   margin-left: 0px;
   margin-top: 0px;
   width: 44px;
   height: 202px;
   background: url(../img/left.png);
  }
  
#right {
   position: absolute;
   margin-left: 591px;
   margin-top: 69px;
   width: 259px;
   height: 186px;
   background: url(../img/right.png);
  }
  
#inner_header {
     position: absolute;
     margin-left: 6px;
     margin-top: 6px;
     width: 536px;
     height: 195px;
    }
    
.lang {
   margin-bottom: 5px;
  }
  
#nav {
   position:absolute;
   margin-left: 592px;
   margin-top: 200px;
   z-index: 50000;
  }
.shortnav {
    font-size: 11px;
   }
  
.shortnav a {
    color: #7a7a7a;
   }
   
.shortnav a:hover {
      text-decoration: none;
     }
     
.shorttext {
    font-size: 11px;
   }
  
#inner_content_text {
      position: absolute;
      margin-left: 10px;
      margin-top: 10px;
      width: 522px;
      height: 385px;
      overflow: auto;
      z-index: 1000;
     }
     
.ue {
  font-size: 11px;
  font-weight: bold;
 }
  
#logo {
   position: absolute;
   margin-left: 592px;
   margin-top: 0px;
   width: 117px;
   height: 91px;
   background: url(../img/logo.png);
  }
  
#content {
    position: absolute;
    margin-left: 44px;
    margin-top: 210px;
    width: 542px;
    height: 420px;
    background: url(../img/content_bg.png) repeat-x #fffcf7;
    z-index: 10000;
   }
   
#bottom  {
 position: absolute;
 margin-left: 40px;
 margin-top: 620px;
 background: url(../img/bottom_bg.png);
 width: 537px;
 height: 230px;
 z-index: 80000;
   }
   
#anfrage {
    position: absolute;
    margin-left: -5px;
    margin-top: 20px;
    width: 150px;
    height: 186px;
    line-height: 0.7em;
   }
   
#anfrage_buchen{
     position: relative;
     margin-top: 500px;
     margin-left: 597px;
     width: 140px;
     height: 112px;
    }

    
#inner_anfrage_buchen {
       background: #f3eee6;
       margin-top: 10px;
       padding-left: 7px;
      }
      
#webcam {
   position: absolute;
   margin-left: 30px;
   margin-top: 0px;
   width: 220px;
   height: 140px;
/*   border: #CCCCCC solid 1px;*/
   z-index: 50001;
  }
#webcamtext {
   position: absolute;
   width: 220px;
   height: 100px;
   margin-left: 155px;
   margin-top: 5px;
   
/*   border: #000000 solid 1px;*/
   z-index: 1000;
   color: #FFFFFF;
   font-size: 9px;
  }
  
#wetter {
   position: absolute;
   margin-left: 370px;
   margin-top: 64px;
   z-index: 50001;  
  }
  
#callback {
    position: absolute;
    margin-left: 370px;
    margin-top: 5px;
    width: 131px;
    height: 39px;
    z-index: 50001;  
   }
   
#angebote {
    position: absolute;
    margin-left: 0px;
    margin-top: 200px;
    width: 261px;
    height: 95px;
   }
   
#gutschein {
    position: absolute;
    margin-left: 318px;
    margin-top: 615px;
    width: 125px;
    height: 100px;
    background: url(../img/other_bg_index.png);
    border-right: 2px solid #e0492e;
   }
   
#gutschein_head {
     position: absolute;
     margin-left: 0px;
     margin-top: 0px;
    }
    
#gutschein_text {
     position: absolute;
     margin-left: 5px;
     margin-top: 35px;
     color: #505050;
     font-size: 11px;
     width: 115px;
     height: 60px;
    }
    
#gutschein_text a {
      color: #505050;      
     }
     
#gutschein_text a:hover {
       color: #909090;      
      }
    
#guenstigefluege {
      position: absolute;
      margin-left: 453px;
      margin-top: 615px;
      width: 130px;
      height: 100px;
      border-right: 2px solid #e0492e;
      padding-right: 5px;
     }
     
#guenstigefluege_head {
       position: absolute;
       margin-left: 0px;
       margin-top: 0px;
      }
      
#guenstigefluege_text {
     position: absolute;
     margin-left: 5px;
     margin-top: 30px;
     color: #505050;
     font-size: 11px;
     width: 115px;
     height: 60px;
    }
    
#guenstigefluege_text a {
      color: #505050;      
     }
     
#guenstigefluege_text a:hover {
       color: #909090;      
      }
      
#footer {
   position: absolute;
   margin-left: 80px;
   margin-top: 854px;
   color: #7a7a7a;
   font-size: 9px;
   width: 500px;
   text-align: center;
  }
  
#footer a {
    color: #7a7a7a;
   }
   
#footer a:hover {
     text-decoration: none;
    }
    
.img {
   float: left;
   width: 75px;
   margin-left: 5px;
  }
  
#foto_div {
    width: 490px;
    float: left;
    margin-top: 10px;
   }  
  
.ue_2 {
   font-size: 11px;
   font-weight: bold;
   padding-bottom: 5px;
  }
  
#video_nav {
    margin: 0;
    padding: 0;
    margin-left: 20px;
    list-style: circle;
   }
   
#video_nav li {
     margin-bottom: 3px;
    }
  
#video_nav a {
     font-size: 11px;
     color: black;
     text-decoration: none;  
    }
    
#video_nav a:hover {
      font-size: 11px;
      color: black; 
      text-decoration: underline;   
     }
     
.img6 {
 float: left;
 margin-left: 5px;
}
.img66 {
 float: left;
 margin-left: 10px;
 padding-bottom: 20px;
  }     
.link a {
   color: black;
  }
  
#gallery
{
position:absolute;
}
 
holy ....
mal ne kurze Frage wo soll das menü denn sein denn bei mir steht das in mitten des contents.
was wohl kaum deine absicht sein kann.
 
das siehst du an den anderen menüpunkten.

das menü sollte genau unter der sprachenauswahl stehen.

hab aber keine ahnung warum es genau mit dem menüpunkt nicht klappt. es sollte so sein wie mit den anderen menüpunkten.
 
Hallo,

also da würde ich mal sagen da hast dir was vorgenommen.
Über Tabelle als Layout sage ich mal nichts da dies das geringste Problem ist.


Also zuerst hast mindestens zwei DIVs die nicht richtig geschlossen sind oder zuviel geschlossen sind und css bzw. Style block mitten im html code.

Jeder einzelne Punkt zerschiest schon eine Seite und damit ist auch klar wieso alles verschoben ist, von anderen Browser reden wir auch erst ein mal nicht und Scroll in Scroll usw. :O)

So ein Tipp wie, schreibe mal xy in Zeile Z geht bei diesem chaos wohl nicht :O(.

Cheffchen
 
hast du mal versucht das ganze neu zu schreiben? Sieht zwar nach ner heiden Arbeit aus aber
erstens ist das learning by doing und zweitens kannst du gleich deinen Code übersichtlicher gestalten.
 
Im CSS #nav
Code: 
position relative
dann noch margin-top auskommentieren. oder besser
Code: 
margin-top: -50px;

Dass dein Menü dann in den Content ragt ist dir aber schon klar (ich vermute daher der Z-Index)

Dann bekommst du noch Schwierigkeiten mit dem ganzen Urlaubsangebot-Geraffel (Bild, Wetter, Dropdown etc), das würde ich in einen Div Packen und unter dem Menü ausrichten.
 
Zuletzt bearbeitet von einem Moderator:
@Cheffchen:

vielen vielen dank!!!!! :D

dein tipp mit den nicht richtig geschlossenen divs war der springende punkt. jetzt gehts wieder :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben