ilch Forum » Allgemein » HTML, PHP, SQL,... » Prob mit Navi

Geschlossen
  1. Mo. 22.10.2007 19:13 Uhr #1
    User Pic
    MiKu Mitglied
    Registriert seit
    22.10.2007
    Beiträge
    5
    Beitragswertungen
    0 Beitragspunkte
    N'abend!

    Problem,
    Hab eine Dropdown Navi in mein Design eingefügt, allerdings bekomme ich es nicht hin, diese nach meinen Wünschen zu formatieren (designen).
    HIER DER LINK ZUR PAGE

    Index.html 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd">
<html>
<head>
<title>
Die Familie - Clanpage
</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="include/designs/ilchClan/style.css">
</head>
<body> 
<div id="wrap">
  <div id="top">
<div id="menuebox">

	<div id="menue">
		<div class="aussen">
<span class="menutag">Home</span>
<a class="innen-1" href="http://diefamilie.byto.de/test/index.php?news">News</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?forum">Forum</a>

		</div>
		<div class="aussen">
<span class="menutag">Clan</span>
<a class="innen-1" href="http://diefamilie.byto.de/test/index.php?teams">Teams</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?wars">Wars</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?awards">Awards</a>
		</div>
		<div class="aussen">
<span class="menutag">Media</span>
<a class="innen-1" href="http://diefamilie.byto.de/test/index.php?downloads">Downloads</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?gallery">Gallery</a>
		</div>
		<div class="aussen">
<span class="menutag">Misc</span>
<a class="innen-1" href="http://diefamilie.byto.de/test/index.php?gbook">Gästebuch</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?links">Links</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?contact">Kontakte</a>
<a class="innen" href="http://diefamilie.byto.de/test/index.php?impressum">Impressum</a>
		</div>
	</div>


	<div class="stupidie">
<a class="auss" href="#"><span class="menutag">Home</span>
<table><tr><td>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?news">News</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?forum">Forum</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Clan</span>
<table><tr><td>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?teams">Teams</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?wars">Wars</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?awards">Awards</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Media</span>
<table><tr><td>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?downloads">Downloads</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?gallery">Gallery</a>
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Misc</span>
<table><tr><td>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?gbook">Gästebuch</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?links">Links</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?contact">Kontakte</a>
<a class="inn" href="http://diefamilie.byto.de/test/index.php?impressum">Impressum</a>
</td></tr></table>
</a>
	</div>


</div>
</div>

  <div id="header"><h1>{SITENAME}</h1></div>
  <div id="top2"><font><b> &raquo; </b>{HMENU}</font></div>
  <div id="content">
  <div id="left_col">
    {_list_menunr1@
    <b class="menu_heading">%1</b>
    <table cellpadding="0" cellspacing="0" border="0" width="100%">
	 <tr style="height: 12px;background: url(include/designs/ilchClan/img/box_left_middle.jpg) top 	  	 left repeat-y;">
	  	<td style="height: 12px; background: url(include/designs/ilchClan/img/box_left_topend.jpg) 			top 

left no-repeat;">
		</td>
	 </tr>    
      <tr>
        <td style="background: url(include/designs/ilchClan/img/box_left_middle.jpg) top left repeat-y;" 	align="top">%2
	</td>
      </tr>
	  <tr style="height: 9px;background: url(include/designs/ilchClan/img/box_left_middle.jpg) top 			  left 

repeat-y;">
	  	<td style="height: 9px; background: 		url(include/designs/ilchClan/img/box_left_topend.jpg) bottom left 

no-repeat;">
		</td>
	</tr>
    </table>
    <br />
    }
  
  </div>
  
  <div id="main_col">{EXPLODE}</div>
  
  <div id="right_col1">
        {_list_menunr2@
        <table width="141" cellpadding="0" cellspacing="0" border="0">
          <tr>
            <td style="width: 141px; height: 18px; background: url(include/designs/ilchClan/img/box_middle-right_top.jpg) no-repeat 

bottom left;" align="center"><b class="menu_heading">%1</b>
	    </td>
          </tr>
	  <tr>
            <td style="min-height:100px; background: url(include/designs/ilchClan/img/box_mittle-right_middle.gif) repeat-y; 

padding: 4px;">%2
	    </td>
          </tr>
	  <tr>
            <td><img src="include/designs/ilchClan/img/box_middle-right_bottom.jpg" alt="" />
	    </td>
          </tr>
        </table>
        <br />
        }
  </div>
  
  <div id="right_col2">
  
        {_list_menunr3@
        <table width="141" cellpadding="0" cellspacing="0" border="0">
          <tr>
            <td  style="width:141px; height:16px; background: url(include/designs/ilchClan/img/box_middle-right_top11.jpg) 

no-repeat;"><b class="menu_heading">%1</b>
	    </td>
          </tr>
	  <tr>
            <td style="min-height:100px; background: url(include/designs/ilchClan/img/box_mittle-right_middle.gif) repeat-y; 

padding:4px;">%2
	    </td>
          </tr>
	  <tr>
            <td><img src="include/designs/ilchClan/img/box_middle-right_bottom.jpg" alt="" />
	    </td>
          </tr>
       </table>
        <br />
        }
        
  </div>
  
  <br style="clear: both;" />
  </div>
  
  <div id="footer">
  </div>
</div>

</body>
</html>


         <!--
					{_list_DDDmenupoint@
					  <strong><big>&middot;</big></strong>
            <a %1 class="box" href="%2">%3</a>
            <br />
					}
          //-->
          
          <!-- beispiel:
            [null, '%3', '%2', '%1', null|],|,
          -->
          <!--           anfang        +     link                |ende |teilende|teilee  -->
          <!-- horizontaler menupunkt -->
          {_list_hmenupoint@<li><a target="%1" class="box" href="%2">%3</a>|</li>|<br />|</ul></li>}
          <!-- horizontaler menupunkt anfang -->
          {_list_hmenubegi@<ul>}
          <!-- horizontaler menupunkt ende -->
          {_list_hmenuende@</ul>}
          
          <!-- vertikaler menupunkt -->
          {_list_vmenupoint@<li><a target="%1" class="box" href="%2">%3</a>|</li>|<br /><ul>|</ul></li>}
          <!-- vertikaler 

menupunkt anfang -->
          {_list_vmenubegi@<ul>}
          <!-- vertikaler menupunkt ende -->
          {_list_vmenuende@</ul>}

    Style.css 
    /*
copyright by ilch.de
Support auf www.ilch.de
*/
body {
  margin: 0;
  padding: 0;
  text-align: center;
  background-color: #4A4849;
  font-size: 12px;
  font-family: Verdana, sans-serif;
}
#wrap {
  position: relative;
  width: 967px;
  text-align: left;
  margin: 0 auto 0 auto;
}

#top {
  background: url(img/top.jpg);
  height: 35px;
  
}


#menuebox {
position: relative;
height: 30px;
}
.stupidie {
display: none;
}
#menue {
position:absolute;
top: 5px;
left: 0;
z-index: 200;
}

#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 8em;
height: 1.3em;
font-weight: bold;
text-align: center;
background-color: #dec79a;
color: #513913;
border: 1px solid;
border-color: #d0843e #78561d #78561d #d0843e;
}
#menue .aussen:hover {
height: auto;
background-color: #624617;
color: #fff;
}

a.innen-1 {
margin-top: 2px;
}
a.innen,
a.innen-1 {
display: block;
width: 7.9em;
padding: 2px 0;
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.innen,
a:visited.innen-1 {
background-color: #ecd8ae;
color:#555;
}
a:hover.innen,
a:hover.innen-1 {
background-color: #f7eedb;
color: #900;
}

span.menutag {
display: block;
cursor: default;
}



/*
	Menue-styles fuer IEs
	Am besten per Conditional Comment einbinden.
	Fuer IE5.5 und 5.0 muessen nur geringfuegige kosmetische
	Anpassungen vorgenommen werden (siehe Kommentare).
*/

#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}

a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #dec79a;
color: #513913; 
border: 1px solid;
border-color: #d0843e #78561d #78561d #d0843e;
}
a:hover.auss {
overflow: visible;
background-color: #624617;
color: #fff;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #dec79a;
color: #400;
border-collapse: collapse;
}

a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.inn {
background-color: #ecd8ae;
color:#444;
}
a:hover.inn {
position: relative;
background-color: #f7eedb;
color: #900;
}
span.menutag {
display: block;
cursor: default;
}
#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}

a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #dec79a;
color: #513913; 
border: 1px solid;
border-color: #d0843e #78561d #78561d #d0843e;
}
a:hover.auss {
overflow: visible;
background-color: #624617;
color: #fff;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #dec79a;
color: #400;
border-collapse: collapse;
}

a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.inn {
background-color: #ecd8ae;
color:#444;
}
a:hover.inn {
position: relative;
background-color: #f7eedb;
color: #900;
}
span.menutag {
display: block;
cursor: default;
}


#header {
  background: url(img/logo.jpg);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}

#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 0px;
}

#top2 {
  background: url(img/top2.gif);
  height: 31px;
}

#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}

#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
  width: 964px;
}

#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}


#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #000000;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #777777;
}

#left_col .menu_heading
{
  background: url(img/menuetop.jpg);
  color: #fff;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
  padding-left: 100px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 7px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
  padding-left: 10px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #000000;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a 
{
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a:hover 
{   
  text-decoration: none;  
}

a.box 
{ 
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a.box:hover 
{   
  text-decoration: none;  
}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}

.Cmite
{
  background-color: #B4C6D8;
}

.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}

hr 
{ 
    height: 0px; 
    border: solid #003366 0px; 
    border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
    border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}

#header {
  background: url(img/logo.jpg);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}

#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 0px;
}

#top2 {
  background: url(img/top2.gif);
  height: 31px;
}

#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}

#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
  width: 964px;
}

#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}


#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #000000;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #777777;
}

#left_col .menu_heading
{
  background: url(img/menuetop.jpg);
  color: #fff;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
  padding-left: 100px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 7px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
  padding-left: 10px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #000000;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a 
{
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a:hover 
{   
  text-decoration: none;  
}

a.box 
{ 
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a.box:hover 
{   
  text-decoration: none;  
}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}

.Cmite
{
  background-color: #B4C6D8;
}

.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}

hr 
{ 
    height: 0px; 
    border: solid #003366 0px; 
    border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
    border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}

    und nun zu meinen Vorstellungen:
    -Navi soll recht oben, über dem Header stehn.
    Auf dem top.jpg (wo es drauf ist)
    -Es soll weiß sein und einen schwarzen Rand haben.
    -Die Menüpunkte sollen gleiche Breite haben wie die Liste.

    Hab wirklich wenig Ahnung von dem Ganzen, daher würde ich mich über Ratschläge sehr freuen.

    Gruß
    0 Mitglieder finden den Beitrag gut.
  2. Mo. 22.10.2007 19:28 Uhr #2
    User Pic
    MiKu Mitglied
    Registriert seit
    22.10.2007
    Beiträge
    5
    Beitragswertungen
    0 Beitragspunkte
    Farben habe ich bereits selber gelöst, allerdings stellt mich das Verschieben der Navi nacht rechts, über den Header noch vor Rätsel!

    Neuer Code der Style.css: 
    /*
copyright by ilch.de
Support auf www.ilch.de
*/
body {
  margin: 0;
  padding: 0;
  text-align: center;
  background-color: #4A4849;
  font-size: 12px;
  font-family: Verdana, sans-serif;
}
#wrap {
  position: relative;
  width: 967px;
  text-align: left;
  margin: 0 auto 0 auto;
}

#top {
  background: url(img/top.jpg);
  height: 35px;
  
}


#menuebox {
position: relative;
height: 30px;
}
.stupidie {
display: none;
}
#menue {
position:absolute;
top: 5px;
left: 0;
z-index: 200;
}

#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 8em;
height: 1.3em;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #000;
border: 1px solid;
border-color: #000 #000 #000 #000;
}
#menue .aussen:hover {
height: auto;
background-color: #fff;
color: #000;
}

a.innen-1 {
margin-top: 2px;
}
a.innen,
a.innen-1 {
display: block;
width: 7.9em;
padding: 2px 0;
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #000;
background-color: #fff;
color: #000;
}
a:visited.innen,
a:visited.innen-1 {
background-color: #fff;
color:#000;
}
a:hover.innen,
a:hover.innen-1 {
background-color: #87cefa;
color: #000;
}

span.menutag {
display: block;
cursor: default;
}



/*
	Menue-styles fuer IEs
	Am besten per Conditional Comment einbinden.
	Fuer IE5.5 und 5.0 muessen nur geringfuegige kosmetische
	Anpassungen vorgenommen werden (siehe Kommentare).
*/

#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}

a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #fff;
color: #000; 
border: 1px solid;
border-color: #000 #000 #000 #000;
}
a:hover.auss {
overflow: visible;
background-color: #fff;
color: #000;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #fff;
color: #000;
border-collapse: collapse;
}

a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #000;
background-color: #fff;
color: #000;
}
a:visited.inn {
background-color: #fff;
color:#000;
}
a:hover.inn {
position: relative;
background-color: #87cefa;
color: #000;
}
span.menutag {
display: block;
cursor: default;
}
#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}

a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #fff;
color: #000; 
border: 1px solid;
border-color: #000 #000 #000 #000e;
}
a:hover.auss {
overflow: visible;
background-color: #fff;
color: #000;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #fff;
color: #000;
border-collapse: collapse;
}

a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #000;
background-color: #fff;
color: #000;
}
a:visited.inn {
background-color: #fff;
color:#000;
}
a:hover.inn {
position: relative;
background-color: #87cefa;
color: #000;
}
span.menutag {
display: block;
cursor: default;
}


#header {
  background: url(img/logo.jpg);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}

#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 0px;
}

#top2 {
  background: url(img/top2.gif);
  height: 31px;
}

#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}

#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
  width: 964px;
}

#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}


#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #000000;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #777777;
}

#left_col .menu_heading
{
  background: url(img/menuetop.jpg);
  color: #fff;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
  padding-left: 100px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 7px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
  padding-left: 10px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #000000;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a 
{
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a:hover 
{   
  text-decoration: none;  
}

a.box 
{ 
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a.box:hover 
{   
  text-decoration: none;  
}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}

.Cmite
{
  background-color: #B4C6D8;
}

.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}

hr 
{ 
    height: 0px; 
    border: solid #003366 0px; 
    border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
    border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}

#header {
  background: url(img/logo.jpg);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}

#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 0px;
}

#top2 {
  background: url(img/top2.gif);
  height: 31px;
}

#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}

#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
  width: 964px;
}

#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}


#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #000000;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #777777;
}

#left_col .menu_heading
{
  background: url(img/menuetop.jpg);
  color: #fff;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
  padding-left: 100px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 7px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
  padding-left: 10px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.jpg) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #000000;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a 
{
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a:hover 
{   
  text-decoration: none;  
}

a.box 
{ 
  color: #222222; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a.box:hover 
{   
  text-decoration: none;  
}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}

.Cmite
{
  background-color: #B4C6D8;
}

.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}

hr 
{ 
    height: 0px; 
    border: solid #003366 0px; 
    border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
    border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}
    0 Mitglieder finden den Beitrag gut.
  3. Mo. 22.10.2007 19:38 Uhr #3
    User Pic
    MiKu Mitglied
    Registriert seit
    22.10.2007
    Beiträge
    5
    Beitragswertungen
    0 Beitragspunkte
    So auch das Problem mit der Navi recht über den Header ist gelöst... war recht simpel... frage ist nur ob es auch für jeden Explorer und auf jeder auflösung gleich ist...

    wenn ihr nen Fehler entdeckt... pls melden!

    Veränderter Code in Style.css 
    #menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 18px;
right: 7px;
z-index: 200;
}
    0 Mitglieder finden den Beitrag gut.
  4. Mo. 22.10.2007 20:44 Uhr #4
    User Pic
    eXecut1oner Mitglied
    Registriert seit
    26.10.2006
    Beiträge
    827
    Beitragswertungen
    0 Beitragspunkte
    bei mir in FF funzts schon mal nicht in IE schon, Opera hab ich garnicht probiert nachdems schon in FF nicht funzt

    was auch schnlecht is (zumindest bei mir in FF mit noscript): sollte JS deaktiviert sein ist die navi ständig ausgeklappt was auch komisch rüberkommt...
    it's not a bug, it's a feature... nsk-team.com
    0 Mitglieder finden den Beitrag gut.
  5. Di. 23.10.2007 08:07 Uhr #5
    User Pic
    MiKu Mitglied
    Registriert seit
    22.10.2007
    Beiträge
    5
    Beitragswertungen
    0 Beitragspunkte
    Morgen!
    Ich hab auch grad mal FF & Opera ausprobiert,
    muss leider sagen, dass geht gar nicht!

    #mit FF
    gesperrtes Bild

    #mit Opera
    gesperrtes Bild

    weiß jmd wo der, bzw die Fehler sind!!??


    Zuletzt modifiziert von MiKu am 23.10.2007 - 08:10:04
    0 Mitglieder finden den Beitrag gut.
  6. Do. 25.10.2007 09:18 Uhr #6
    User Pic
    MiKu Mitglied
    Registriert seit
    22.10.2007
    Beiträge
    5
    Beitragswertungen
    0 Beitragspunkte
    *push*
    keiner eine Idee wo Fehler sind?
    Bei Opera und FF, s.o. in Screens ist die Navigation total unstrukturiert. Formatierung scheint völlig anders zu sein.

    Bitte, ich muss diesen Fehler beheben!!
    0 Mitglieder finden den Beitrag gut.
  7. Do. 25.10.2007 15:44 Uhr #7
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.336
    Beitragswertungen
    390 Beitragspunkte
    Schau mal hier -> barrierefrei.e-workers.de/workshops/tricks/menues.php
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu HTML, PHP, SQL,...

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten