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

Fußzeile anpassen

Status
Für weitere Antworten geschlossen.

riddle23

Neues Mitglied
hi ich arbeite gerade an ein design für webspell, also auf tabellen basis und habe ein problem mit der fußzeile.
die sollte immer mindestens am unteren bildschirmrand sein da sonst das design nicht so zur geltung kommt wie es soll^^

ich hab es jetzt schon mit: td height 100% versucht dann ist die fußzeile zwar ganz unten aber ich kann keine weiteren tabellen mehr im content der seite anlegen. gibt es da nen trick das umzusetzen?


so sollte es ungefähr aussehn...
hier noch ne demo seite damit ihr ggf. in den code schaun könnt.. webSPELL v4.0 demo

naja bin für jede hilfe und anregung sehr dankbar!!
mfg riddle.23
 
Was soll denn passieren wenn der Inhalt nicht zwischen Kopf und Fußzeile passt?
Soll dann nur der Inhalt gescrollt werden oder soll die Fußzeile mitwandern?
 
@ threadi: die webspell homepage selbst hat schon 200 errors daher wird es wahrscheinlich nicht möglich sein alle zu beheben..

@ neuroleptika: die fußzeile soll mitwandern! ich wollte zwar schon aus verzweiflung frames verwenden aber habe mich dann doch entschlossen es weiter zu versuchen!

@ prm: vielen dank für den tip sieht sehr gut aus!! 8)
 
@ threadi: die webspell homepage selbst hat schon 200 errors daher wird es wahrscheinlich nicht möglich sein alle zu beheben..

Viele sind nur Folgefehler - sollte doch nicht das Problem sein?!

@neuroleptika: mit !important wird der Wert von modernen Browsern genutzt. Ältere nehmen halt den Wert darunter, der für moderne Browser nicht relevant ist. Durchaus pfiffig, aber wenn man zu sowas greifen muss ist irgendwas grundlegend Faul.
 
Vie Durchaus pfiffig, aber wenn man zu sowas greifen muss ist irgendwas grundlegend Faul.
Nee ist nix faules drann.
Der IE6 und darunter kennt kein min-height. Das Prinzip ist aber auf min-height angewiesen.
Der Footer würde sonst immer bottom vom viewpoint ausgerichtet sein.
Der IE6 und darunter vergrößert die Boxen auch mit einfacher height-Angabe.

Die Frage ist hier schon öfter aufgekommen. Ich habe das oft mit Sternchen-Hack-Beispielen beantwortet. auf die !important-Lösung bin ich in dem Zusammenhang noch nicht gekommen.

Den Quelltext habe ich mir in diesem Beispiel nicht angesehen.

Schön finde ich an prms Beispiel, daß es (theoretisch) kein reiner IE-Hack ist. (Das css bleibt valide)

Ein kleines Manko besteht dennoch:
Es dürfte in Browsern stören, die kein min-height kennen und den IE-Fehler im height nicht haben.
(In der Praxis sicher unwichtig)
 
Zuletzt bearbeitet:
@ threadi: ne sollte nicht so das prob sein aber zZ macht mir das design hauptsächlich sorgen.. od kann es sein das es wegen dem nicht richtig angezeigt wird?

hab das tut von prm befolgt und herausgekommen ist ne mischung aus css und html die wieder nicht richtig funktioniert^^
wenn ich die content (html)tabelle auf height=100% setze hab ich das prob
das sich die seite gleich automatisch auf die grösstmögliche höhe setzt
und somit der footer wieder immer nur unter dem bildschirmrand zu finden ist.

ohne diesem height=100% passt der footer zwar, die seite wird aber nur zur hälfte angezeigt wenn is kleiner ist und bricht durch den footer durch wenn sie grösser wird...

mit diesen zwei varianten wahr ich am nähesten dran am gewünschten resultat dran aber es müsste doch noch andere möglichkeiten geben od?
wie kann ich den footer bzw. die seite optimal dynamisch machen?
auf jeden fall vielen dank im vorraus für jede hilfe!

die seite ist hier zu finden, wenn man auf forum klickt zB. kann mans gut testen... demo seite
ansonsten hier noch der komplette code...

Code:
<?php
/*
 ########################################################################
#                                                                        #
#           Version 4       /                        /   /               #
#          -----------__---/__---__------__----__---/---/-               #
#           | /| /  /___) /   ) (_ `   /   ) /___) /   /                 #
#          _|/_|/__(___ _(___/_(__)___/___/_(___ _/___/___               #
#                       Free Content / Management System                 #
#                                   /                                    #
#                                                                        #
#                                                                        #
#   Copyright 2005-2006 by webspell.org                                  #
#                                                                        #
#   visit webSPELL.org, webspell.info to get webSPELL for free           #
#   - Script runs under the GNU GENERAL PUBLIC LICENSE                   #
#   - It's NOT allowed to remove this copyright-tag                      #
#   -- GNU General Public License - Free Software Foundation                    #
#                                                                        #
#   Code based on WebSPELL Clanpackage (Michael Gruber - webspell.at),   #
#   Far Development by Development Team - webspell.org                   #
#                                                                        #
#   visit webspell.org                                                   #
#                                                                        #
 ########################################################################
*/

// important data include

include("_mysql.php");
include("_settings.php");
include("_functions.php");

// end important data include
?>

<html>
<head>
<title>100%</title>
<style type="text/css">
<!--
* {
margin: 0;
}

html, body {
height: 100%;
}

BODY { background-color: white; }

p, h1 {
padding-bottom: 10px;
}

a:link {color:#333333; text-decoration:none}
a:visited {color:#333333; text-decoration:none}
a:active {color:#333333; text-decoration:none}
a:hover {color:red; text-decoration:underline}

#wrapper {
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
}

#top {
height: 120px;
}

#content {
background-image:url(img/mb.png);
}

#footer {
position: absolute;
bottom: 0;
width: 100%;
height: 102px;
line-height: 1.5em;
text-align: center;
background: #8B8878;
background-image:url(img/bb.png);
}
-->
</style>
</head>

<body>
<div id="wrapper">
<div id="top">
  <table width="100%" height="120" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td background="img/tb.png">&nbsp;</td>
      <td width="263" background="img/tbl.png">&nbsp;</td>
      <td background="img/tb.png">&nbsp;</td>
      <td width="155" background="img/tbr.png">&nbsp;</td>
      <td background="img/tb.png">&nbsp;</td>
    </tr>
  </table>
</div>
<div id="content">
  <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td>&nbsp;</td>
      <td width="5" valign="top" background="img/pbl.png">&nbsp;</td>
      <td valign="top" width="850" background="img/mpb.png"><table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td height="10"></td>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td valign="top" height="200"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td height="30"></td>
                  <td></td>
                </tr>
                <tr>
                  <td width="30">&nbsp;</td>
                  <td><p><img src="img/aro.png" /> <a href="Unbenanntes Dokument">Startseite </a></p>
                    <p><img src="img/aro.png" /> <a href="Unbenanntes Dokument">Forum </a></p>
                    <p><img src="img/aro.png" /> <a href="Unbenanntes Dokument">Mitglieder </a></p>
                    <p><img src="img/aro.png" /> <a href="Unbenanntes Dokument">ClanWars </a></p>
                    <p><img src="img/aro.png" /> <a href="Unbenanntes Dokument">Servers </a></p></td>
                </tr>
              </table></td>
              <td width="600" background="img/banner.png">&nbsp;</td>
            </tr>
          </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td height="10"></td>
              </tr>
              <tr>
                <td height="25" background="img/ptb.png"></td>
              </tr>
              <tr>
                <td height="10"></td>
              </tr>
            </table>            
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td><?
      if(!isset($site)) $site="news";
      //Sichheitsl&uuml;cke beheben
      $invalide = array('/','/\/',':','.');
      $site = str_replace($invalide,' ',$site);
      if(!file_exists($site.".php")) $site = "news";
      include($site.".php");
      ?></td>
                <td width="10"></td>
                <td width="280"></td>
              </tr>
            </table>            </td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td height="10"></td>
          <td></td>
          <td width="10"></td>
        </tr>
      </table></td>
      <td width="5" valign="top" background="img/pbr.png">&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </table>
</div>
<div id="footer">
Footer
</div>
</div>
</body>
</html>

greetz
 
Das Problem dürften die prozentualen height-Angaben für die Tabellen sein, die z.T. verschachtelt sind und sich je nach Konstruktion auf das übergeordnete Element beziehen.
Wozu eigentlich die Tabellen? Das geht doch auch ohne und wäre viel übersichtlicher.
 
Wozu eigentlich die Tabellen? Das geht doch auch ohne und wäre viel übersichtlicher.

hab bis jetzt alle webspell templates immer nur mit tabellen in dreamweaver gemacht..
deshalb hab ich ehrlich gesagt keine ahnung wie das ohne tabellen funktionieren soll! :neutral:
würde aber gerne das design tabellenfrei machen da soviele tabellen sowieso nicht das wahre sind..
der einzige vorteil von tabellen ist halt nur das es sehr schnell geht mit dw so ne hp zu erstellen!

naja währ nice wenn du für das vill. auch noch ein paar gute links od. tips hast!

bis dahin werd ich mir mal die seite die neuroleptika gepostet hat ansehn (thx!)
vill kann ich den fehler mit deren hilfe irgendwie beheben.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben