[gelöst] Navigation in Footer - Komme nicht weiter

**helmut** · 28.02.2010, 17:30

Hallo,
vielleicht hat einer einen Tipp, alles versucht aber komme nicht weiter:
Die Navigation Links rutscht mir in den Footer und wenn die snav länger wir auch in den Wrapper rein

ich komme nicht dahinter was ich falsch mache:
Hier die fe-page:

PHP-Code:


<?php echo $this->doctype; ?>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>">

<head>

<base href="<?php echo $this->base; ?>"></base>

<title><?php echo $this->pageTitle; ?> - <?php echo $this->mainTitle; ?></title>

<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $this->charset; ?>" />

<meta http-equiv="Content-Style-Type" content="text/css" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<meta name="description" content="<?php echo $this->description; ?>" />

<meta name="keywords" content="<?php echo $this->keywords; ?>" />

<?php echo $this->robots; ?>

<?php echo $this->framework; ?>

<?php echo $this->stylesheets; ?>

<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>

<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>

<?php echo $this->head; ?>

<link href="/Boots.css" rel="stylesheet" type="text/css">

</head>



<body id="top"<?php if ($this->class): ?> class="<?php echo $this->class; ?>"<?php endif; if ($this->onload): ?> onLoad="<?php echo $this->onload; ?>"<?php endif; ?>>

<div id="wrapper">

    <?php if ($this->header): ?>

        <div id="header">

            <div class="inside">

                  <?php echo $this->header; ?>            </div>

           </div>

    <?php endif; ?>

 <?php echo $this->getCustomSections('before'); ?>



    <div id="container">

        <?php if ($this->left): ?>

         <div id="left">

              <div class="inside">

                   <?php echo $this->left; ?> 

               </div>

          </div>

      <?php endif; ?>



        <?php if ($this->right): ?>

             <div id="right">

                  <div class="inside">

                       <?php echo $this->right; ?> 

                  </div>

             </div>

        <?php endif; ?>



             <div id="main">

                  <div class="inside">

                       <?php echo $this->main; ?> 

                  </div>

                  <?php echo $this->getCustomSections('main'); ?> 

                  <div id="clear">

                </div>

              </div>

    </div>

    <?php if ($this->footer): ?>

        <div id="footer">

            <div class="inside">

                <?php echo $this->footer; ?> 

            </div>

        </div>

    <?php endif; ?>

     <?php echo $this->getCustomSections('after'); ?>

     



     <!-- indexer::stop -->

      <img src="<?php echo $this->base; ?>cron.php" alt="" class="invisible" />

    <!-- indexer::continue -->

     <?php echo $this->mootools; ?>



</div>



<?php if ($this->urchinId): ?>



<script type="text/javascript" src="<?php echo $this->urchinUrl; ?>"></script>

<script type="text/javascript">

<!--//--><![CDATA[//><!--

try {

var pageTracker = _gat._getTracker("<?php echo $this->urchinId; ?>");

pageTracker._trackPageview();

} catch(err) {}

//--><!]]>

</script>



<?php endif; ?>



</body>

</html>

Vielen Dank im voraus.

**Seitengestalter** · 28.02.2010, 19:33

Und mit was beeinflusst Du die Positionierung? Genau, mit CSS! Also hilft die gepostete PHP-Datei leider nichts, da steckt der Fehler nicht. Am günstigsten wäre, wenn Du einen Link zur Seite posten könntest.

Gruß, Roland

**helmut** · 28.02.2010, 20:14

Hallo Roland,
sorry hatte Footer und Wrapper ausgebaut und mich mal vom Rechner getrennt um zu versuchen mal Pause machen.
Alles wieder so eingestellt das der Fehler zu zu sehen ist.
hier die Seite http://www.hmk-swe.de/index.php. Sind bestimmt noch einige Fehler enthalten ist mein erster Versuch mit CSS klar zu kommen.

Habe den #container die von min-height:400px; auf min-height:550px; Jetzt habe läuft mit die Navigation nicht mehr in den Footer, aber glücklich mit der Lösung bin ich nicht.

**Seitengestalter** · 01.03.2010, 09:13

Hallo Helmut,

so wie Du es momentan hast tritt bei mir im Firefox gar kein Problem auf. Ich habe mal probeweise das <div> mit der id=left vergrößert und er schiebt den Footer brav nach unten, auch der Container wird mit vergrößert.
Außerdem kann die Navi ja auch grundsätzlich nicht so weit nach unten gelangen, da das div auf der rechten Seite, also der Inhalt, viel höher ist als die Navi.
In welchem Browser taucht das Problem denn auf?

Und wo wir gerade dabei sind: Schreibe Deine CSS-Anweisungen gleich in externe CSS-Dateien und nicht ins HTML. Sonst hast Du später nur unnötige Aufräumarbeiten.

Gruß, Roland

**helmut** · 01.03.2010, 10:00

Hallo Roland,
wenn ich #snav li die Zeilenhöhe für den Font als Beispiel auf 30px (also Simulation einer längeren Linkliste für die Submenues) setze dann geht die Navigation über #Wrapper und #Footer .inside hinaus.
Mit der zur Zeit aktiven Zeilenhöhe von 17px bin ich dem Problem ausgewichen.
Der Footer schreibt noch in den unteren Balken des #Wrapper rein, vermute hier beißen sich

Code:

#container
{
	margin-top:0;
	margin-bottom:0;
	min-height:590px;
}

und

Code:

html
{
	height:100%;
	height: auto !important;
}

und
#

Code:

wrapper
{
	height:100%;
	position:relative;
	background-color:#4b5255;
	border-right:7px groove #D7D7D7;
	border-bottom:7px groove #D7D7D7;
	border-left:7px groove #D7D7D7;
	margin: 0 auto; height: auto !important;
}

der

Code:

#footer .inside
{
	clear:both;
	margin-top:0;
	padding:10px;
	text-align:center;
	border-top:1px solid #ffffff;
	font-size:12px;
	color:#e0e0e0;
}

liegt auch meines Erachtens nicht im Container.
Was ich nicht verstanden habe,

Schreibe Deine CSS-Anweisungen gleich in externe CSS-Dateien und nicht ins HTML.

Die CSS Daten habe ich in basic.css und boots.css liegen. Da stehe ich auf mir wohl selbst auf der Leitung.

Setze FF 3.5.6 ein und Teste parallel IE 7 weil den mein Freund einsetzt.

Ist das erste Mal, dass ich mit versuche mit CSS auseinander zu setzen und versuche mich über alle möglichen Wege schlau zum machen, aber noch nicht so richtig gelingt.

Herzlichen Dank für Deine Hilfe, auch wenn ich im Moment nicht so richtig weiter weiß, aber das liegt an mir darüber bin ich mir klar und ist ernüchternd.

**Seitengestalter** · 01.03.2010, 12:04

Hallo Helmut,

bin gerade im Job und kann nicht viel Zeit investieren, daher ohne Garantie:

Versuch doch mal #snav mit position:relative zu ergänzen, also so:

Code:

#snav {
margin:0;
padding-top:0;
position:relative;
}

Bezüglich CSS meinte ich, Du sollst CSS-Anweisungen nicht in die Template-Dateien (*.tpl) schreiben. Vielleicht habe ich da aber auch falsch geguckt

Ich finde die Stelle auf die Schnelle nicht mehr.

**helmut** · 01.03.2010, 13:32

Hallo Roland,
Du hast mir sehr geholfen, genau das war was noch gefehlt hat. Es sieht so aus, alles ist im grünen Bereich, nichts überlappt mehr. Langsam fange ich an Abhängigkeiten zur verstehen, Dank Deiner Hilfe! Den Fehler im Footer habe ich gefunden, die Höhe der Fußzeile im Seitenlayout war zu klein.

Herzlichen Dank!