Mitlaufende Navigation in CSS

Hera137 · 20.08.13, 14:49

Da wird halt auch auf position: fixed verwiesen, was mir aber die Navigation so verhaut

NetWebs · 20.08.13, 18:17

Zitat:

Zitat von Hera137

Da wird halt auch auf position: fixed verwiesen, was mir aber die Navigation so verhaut

Dann liegt der Fehler in Deiner Navigation.

Hera137 · 20.08.13, 18:44

Die Links werden halt über PHP festgelegt, nicht über HTML. Kanns daran liegen?

NetWebs · 20.08.13, 19:10

Zitat:

Zitat von Hera137

Die Links werden halt über PHP festgelegt, nicht über HTML. Kanns daran liegen?

Nein, definitiv nicht.

Hera137 · 20.08.13, 19:27

Ok, anders...

Ich poste hier mal das Template. Es funktioniert ja, die Navigation ist ja da. Es läuft nur halt nicht. Vielleicht hab ich doch nen Fehler irgendwo...

HTML:

Code:

<!--!header-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//DE">
<html>
  <head>
    <title>Totenwelt Himera</title>
    <link href='templates/hime spezial.css' rel='stylesheet' type='text/css'>
    {heads*****}{s*****}
  </head>
  <body bgcolor="#000000" text="#ffffff" style="margin: 0px; padding: 0px;">

  <table border="0" width="100%" cellpadding="2">

 <td colspan="3" height="50px">
	   <table border="0" id="table1" cellspacing="0" cellpadding="0" background="templates/himera/oben.gif" width="100%" height="105">
	   <tr>
	   <td>
	   </td>
	   </tr>
	   </table>
        <center><span class='pagetitle'>{title}</span></p></center>
     </td>
    </tr>

    <tr>
     <td colspan="3">
       &nbsp;&nbsp;{motd} • {mail} • {petition}
     </td>

    </tr>
    
    <tr>
      <td width="13%" valign="top">
        <br><br><br><br>
       <img src='templates/himera/links-oben.gif' width='140' height='25' alt=''>{nav}<img src='templates/himera/links-unten.gif' width='140' height='25' alt=''>
      </td>
      <td width="70%" valign="top"><p>&nbsp;</p><!--!footer--></td>
      <td width="17%" valign="top"><p>&nbsp;</p><p>&nbsp;</p><img src='templates/himera/rechts-oben.gif' width='160' height='25' alt=''>{stats}{useronline}<img src='templates/himera/rechts-unten.gif' width='160' height='25' alt=''></td>
	  
    </tr>

  </table>

  <table border="0" width="100%">
    <tr><!--{paypal}-->
      <td width="30%">&nbsp;</td>
      <td width="60%">{copyright} Design: das Puschel</td>
      <td width="10%" align="right">{source}</td>
    </tr>
    <tr>
      <td width="100%" colspan="3" align="center">{pagegen}</td>
    </tr>
  </table>

  <!--!statstart-->
  <table cellpadding="2" cellspacing="0" class="charinfo" width="150">

    <!--!stathead-->
    <tr>
      <td class='charhead' colspan='2'><b>{title}</b></td>
    </tr>


    <!--!statrow-->
    <tr>
      <td class='charinfo'><b>{title}</b></td><td class='charinfo'>`^{value}</td>
    </tr>

    <!--!statbuff-->
    <tr>
      <td class='charinfo' colspan='2'><b>{title}:</b>`n{value}</td>

    </tr>

  <!--!statend-->
  </table>

  <!--!navhead--> <span class="navhead">—{title}—<br></span>
  <!--!navhelp--> <span class="navhelp">{text}<br></span>
  <!--!navitem--> <a href="{link}"{accesskey}class='nav' {popup}>{text}<br></a>

  <!--!login-->
  <table width='212' height='234' border='0' cellpadding='0' cellspacing='0' background='images/logindragon.gif' class='noborder'>
    <tr>
      <td valign='bottom' align='center' class='noborder'>
        {username}: <br><input name='name' accesskey='u' size='10'><br>
        {password}:<br><input name='password' accesskey='p' type='password' size='10'><br>
        <input type='submit' value='{button}' class='button'><br>

        <img src='images/trans.gif' width='1' height='37' align='absmiddle' alt=''>
        <img src='images/trans.gif' width='1' height='15'>
      </td>
    </tr>
  </table>

  <!--!full-->
  <table width='212' height='234' border='0' cellpadding='0' cellspacing='0' background='images/logindragon.gif' class='noborder'>
    <tr>

      <td valign='bottom' align='center' class='noborder'>
        <br>`b`$Server<br><br>voll!`b<br><br><br>
        <img src='images/trans.gif' width='1' height='37' align='absmiddle' alt=''>
      </td>
    </tr>
  </table>

  </body>
</html>

zugehöriges CSS:

Code:

/* CSS Document */
td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

table.nav {
/*	background-color: #000000;*/
	border: 1px solid #000000;
	height: auto;
	width: 135px;
	float: left;
}

.navhead {
	text-decoration: none;
	width: 135px;
	height: auto;
	padding: 1px;
	line-height: 10px;
	float: left;
	clear: none;
	background-color: #000000;
	font-weight: bold;
	color: #FFFFFF;
	cursor: default;
	text-align: center;
}

a {
	color: #808080;
	text-decoration: none;
}

a.nav {
	text-decoration: none;
	position:fixed;
    width: 135px;
	height: auto;
    padding: 1px;
	float: left;
	clear: none;
	background-color: #000000;
	border: 1px solid #000000;
}

.navhelp {
	text-decoration: none;
    width: 135px;
	height: auto;
    padding: 1px;
	float: left;
	clear: none;
	background-color: #000000;
	border: 1px solid #000000;
}

a:hover.nav {
    background-color: #111111;
	border-top: 1px solid #ffffff;
	border-left: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
}
a.navhilite {
	text-decoration: none;
	width: 135px;
	height: auto;
	padding: 1px;
	float: right;
	clear: none;
	color:#FFFF00;
	background-color: #330000;
	border-top: thin solid #330000;
	border-bottom: thin solid #330000;
	border-right: thin none #330000;
	border-left: thin none #330000;
}
a:hover.navhilite {
	background-color: #990000;
	border-top: thin outset #CC0000;
	border-right: thin none #CC0000;
	border-bottom: thin outset #CC0000;
	border-left: thin none #CC0000;
}


table {
}
td.charinfo {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #00cc00;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	cursor: default;
}
td.charhead {
	/*background-color: #00cc00;*/
	border: none;
	cursor: default;
	color: #FF0000;
}
table.charinfo {
	border: none;
	width: 140px;
}
td.pageheader {
	background-color: #000000;
	background-image: url(../templates/himera/oben.gif);
	height: 52px;
}
td.popupheader {
	background-color: #000000;
	background-image: url(../templates/himera/oben.gif);
	height: 52px;
}
td.noborder {
	border: none;
}
table.noborder {
	border: none;
}
td.village {
	background-image: url(../images/village.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
}
td.forest {
	background-image: url(../images/forest.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
}
td.dragon {
	background-image: url(../images/dragon.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
}
input {
	background-color: #000000;
	border: 1px solid #ffffff;
	color: #CCCCCC;
}
.button {
font-family: verdana,arial,helvetica,sans-serif;  
     font-size: 12px;  
     color: #cccccc;  
     background-color: #000000;  
     border-top: 1px solid #ffffff;  
     border-left: 1px solid #ffffff;  
     border-right: 1px solid #c0c0c0;  
     border-bottom: 1px solid #c0c0c0;
}
.input {
	background-color: #000000;
	border: 1px solid #ffffff;
	color: #CCCCCC;
}
select {
	background-color: #000000;
	border: 1px solid #ffffff;
	color: #CCCCCC;
}
table.vitalinfo {
	/*background-color: #000000;*/
	border: 1px solid #000000;
	width: 160px;
}
a.motd {
	text-decoration: none;
	color:#00cc00;
}
a:hover.motd {
	font-weight: bold;
}

a.hotmotd {
text-decoration: blink;
   text-align: center;
   color:7CFC00;
   width: 181px;
   height: auto;
   padding: 1px;
   float: center;
   clear: none;

   background-color: #806B4D;
   border-top: thin solid #FF9900;
   border-bottom: thin solid #FF9900;
   border-right: thin solid #FF9900;
   border-left: thin solid #FF9900;
}
.pagetitle {
	font-family: "Verdana", "Times New Roman";
	font-size: 14px;
	color: #666666;
}
td.footer {
	background-image: url(../templates/schwarz/unten.jpg);
	background-repeat: repeat-x;
	background-position: top;
}
.navhi {
	color: #00FF00;
	text-decoration: underline;
}