sheppardx: Verschiebung meiner Navigation

Hey SELFHTML Forum

Ich Muss ein Portfolio schreiben und habe ein Problemm bei meiner Navigation und zwar verschiebt sich immer die unteren Navigations Punkte ich weiß einfach nicht warum.

Meine Website ist mit bei gelegt da seht ihr was ich mein

  1. Hmm.. wo in deiner CSS-Datei ist denn die navi?

    1. @charset "utf-8";  
      /* CSS Document */  
        
      /* =TAGS  
      ---------------------------------------------------------------------------------*/  
      *{padding: 0; margin: 0; border: 0;}  
        
      html {font-size: 85%;}  
        
      html>body {  
      	font-size: 12px;  
      	font-family:Verdana, Arial, Helvetica, sans-serif;  
      }  
        
      body {  
      	background-image:url(../images/back.jpg);  
      	background-repeat:repeat-y;  
      	background-position:center;  
      	background-color:#000000;  
      	text-align:center;  
      }  
        
      table{  
      	padding:0 0 0 0;  
      	margin:0 0 0 0;  
      }  
        
        
      a:link {color:#962a06; text-decoration:none;}  
      a:visited {color:#962a06; text-decoration:none;}  
      a:focus {color:#ff530d;	text-decoration:none;}  
      a:hover {color:#ff530d; text-decoration:none;}  
      a:active {color:#ff530d; text-decoration:none;}  
        
        
      h1 {margin:25px 0 0 60px; ;padding: 0 0 0 35px; background: transparent url("../images/h1_Krigel.png") no-repeat;}  
      h2 {padding:0px; margin:0px;}  
      h3 {padding: 0 0 10px 0;}  
        
      /* =DIV ID's  
      ---------------------------------------------------------------------------------*/  
        
      #Wrapper{  
      	width:850px;  
      	height:auto;  
      	margin-left:auto;  
      	margin-right:auto;  
      	margin-top:30px;  
      	margin-bottom:20px;  
      	text-align:left;  
      }  
        
      #Header{  
      	width:850px;  
      	height:204px;  
      }  
        
        
      #HeaderBild{  
      	width:850px;  
      	height:90px;  
      	background-color: transparent;  
      	background-image: url(../images/Header.png);  
      	background-repeat: no-repeat;  
      }  
        
      #MainNavBox{  
      	width:850px;  
      	height:114px;  
      	background: #2e2b22;  
      }  
        
      #MainNav{  
      	margin:0 auto 0 auto;  
      	width:850px;  
      	height:114px;  
      	background-color: transparent;  
      	background-image: url(../images/Nav.png);  
      }  
        
        
      /*display:inline*/  
      #MainNav li{float:left;list-style:none;display:block;}  
      #MainNav li a{text-decoration:none; display:block;cursor:pointer}  
        
      #Startseite a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -105px -122px;margin-left: 105px ;margin-top:8px;}  
      #Startseite a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -105px -7px; margin-left: 105px ; margin-top:7px; }  
        
      #Impressum a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -265px -122px;margin-left: 30px ;margin-top:8px;}  
      #Impressum a {width:140px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -265px -7px; margin-left: 30px ; margin-top:7px; }  
        
      #Lebenslauf a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -443px -122px;margin-left: 38px ;margin-top:8px;}  
      #Lebenslauf a {width:150px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -443px -7px; margin-left: 38px ; margin-top:7px; }  
        
      #Photoshop a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -616px -122px;margin-left: 24px ;margin-top:8px;}  
      #Photoshop a {width:150px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -616px -7px; margin-left: 24px ; margin-top:7px; }  
        
      #Fotografie a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -165px -168px;margin-left: 165px ;margin-top:10px;}  
      #Fotografie a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -165px -55px; margin-left: 165px ; margin-top:11px; }  
        
      #NuetzlicheLinks a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -165px -168px;margin-left: 165px ;margin-top:10px;}  
      #NuetzlicheLinks a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -165px -55px; margin-left: 165px ; margin-top:11px; }  
        
      #Content{  
      	width:850px;  
      	height:auto;  
      	background-color: transparent;  
      	background-image: url(../images/Content.png);  
      	background-repeat: repeat-y;  
      	padding-left: 15px;  
      	padding-right: 15px;  
      }  
        
      #ImpressumBot{  
      	width:459px;  
      	height:38px;  
      	background-image: url(../images/ImpressumBot.png);		  
      }  
        
      #ImpressumCont{  
      	background-image: url(../images/ImpressumCont.png);  
      	background-repeat: repeat-y;  
      	height: auto;  
      	width: 459px;  
      	padding-right: 30px;  
      	padding-left: 50px;  
      	font-family: "Times New Roman", Times, serif;  
      }  
        
      #ImpressumFoot{  
      	background-image: url(../images/ImpressumFoot.png);  
      	height: 46px;  
      	width: 459px;	  
      }  
      #Footer{  
      	width:850px;  
      	height:68px;  
      	background-color: transparent;  
      	background-image: url(../images/Footer.png);  
      	background-repeat: no-repeat;  
      }  
      
      
      1. Sorry Falsch gelesen
        #Startseite a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -105px -122px;margin-left: 105px ;margin-top:8px;}
        #Startseite a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -105px -7px; margin-left: 105px ; margin-top:7px; }

        #Impressum a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -265px -122px;margin-left: 30px ;margin-top:8px;}
        #Impressum a {width:140px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -265px -7px; margin-left: 30px ; margin-top:7px; }

        #Lebenslauf a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -443px -122px;margin-left: 38px ;margin-top:8px;}
        #Lebenslauf a {width:150px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -443px -7px; margin-left: 38px ; margin-top:7px; }

        #Photoshop a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -616px -122px;margin-left: 24px ;margin-top:8px;}
        #Photoshop a {width:150px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -616px -7px; margin-left: 24px ; margin-top:7px; }

        #Fotografie a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -165px -168px;margin-left: 165px ;margin-top:10px;}
        #Fotografie a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -165px -55px; margin-left: 165px ; margin-top:11px; }

        #NuetzlicheLinks a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -165px -168px;margin-left: 165px ;margin-top:10px;}
        #NuetzlicheLinks a {width:130px; height:37px; background:transparent url(../images/Nav.png) no-repeat scroll -165px -55px; margin-left: 165px ; margin-top:11px; }

        Das Hier ist sie eigentlich

        1. Probier mal einfach bei jedem link(Fotografie,Photoshop,..) beim Hover-Dingens (xDD) das margin wegzugeben.

          z.b statt

          #Impressum a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -265px -122px;margin-left: 30px ;margin-top:8px;}

          das:

          #Impressum a:hover {background:transparent url(../images/Nav.png) no-repeat scroll -265px -122px;}

          1. wieso hast du bei Hover ein XDD dran angehauen ....?

            und nein das Funktoniert nicht was du gesagt hast