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

Problem mit dem Footer einer HP

mac21

mac21

Neues Mitglied
Hallo :)

Ich habe ein kleines problem mit dem Footer einer HP, die ich für eine Kundenfirma erstellen soll.
die homepage findet ihr unter
120911_GG_Bauer_Architekten

der wunsch der kunden ist: der footer soll am boden fixiert werden, das habe ich ja soweit,
aber: dieser footer soll beim zoomen oder wie er sagte "beim auseinanderziehen des browsers" mitwachsen,
also nach links und rechts in grau mitwachsen, am besten auch immer zentriert.
doch ich weiß nicht wie ich nun vorgehen soll, ich habe leider nur sporadisch erfahrung mit HTML,css etc.
ich bin ein azubi zum fachinformatiker, diese aufgabe ist eigentlich nicht mal mein aufgabenbereich :D
habt ihr ne lösung?

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>120911_GG_Bauer_Architekten</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<style type="text/css">

#footer {
    position            : fixed; bottom: 0px; left: -50px;
    line-height            : 21px;
    

        

}
</style>

</head>
<body background="Bilder/background.jpg";leftmargin="0"; topmargin="0"; marginwidth="0"; marginheight="0">

<!-- Save for Web Slices (120911_GG_Bauer_Architekten.psd) -->
<table id="Tabelle_01" width="1441" height="806" border="0"  cellspacing="0" cellpadding="0" border="0" align="center"; margin:1.5em  13.6em 1.5em 3em>
    <tr>
        <td colspan="10">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_01.gif" width="1440" height="32" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="32" alt=""></td>
    </tr>
    <tr>
        <td rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_02.gif" width="242" height="214" alt=""></td>
        <td colspan="2" rowspan="2">
            <a href="http://www.bauer-architekten.eu"><img  src="Bilder/120911_GG_Bauer_Architekten-neue-slices_03.gif" width="287"  height="79" border="0" alt=""></a></td>
        <td colspan="7">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_04.gif" width="911" height="71" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="71" alt=""></td>
    </tr>
    <tr>
        <td rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_05.gif" width="223" height="224" alt=""></td>
        <td colspan="2" rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_06.gif" width="113" height="58" alt=""></td>
        <td rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_07.gif" width="112" height="58" alt=""></td>
        <td rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_08.gif" width="113" height="58" alt=""></td>
        <td rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_09.gif" width="112" height="58" alt=""></td>
        <td rowspan="7">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_10.gif" width="238" height="285" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="8" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_11.gif" width="287" height="220" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="50" alt=""></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_12.gif" width="225" height="195" alt=""></td>
        <td colspan="2" rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_13.gif" width="225" height="195" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="85" alt=""></td>
    </tr>
    <tr>
        <td rowspan="5">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_14.gif" width="242" height="213" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="81" alt=""></td>
    </tr>
    <tr>
        <td rowspan="5">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_15.gif" width="223" height="224" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="4" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_16.gif" width="287" height="220" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="25" alt=""></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="3">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_17.gif" width="225" height="195" alt=""></td>
        <td colspan="2" rowspan="3">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_18.gif" width="225" height="195" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="32" alt=""></td>
    </tr>
    <tr>
        <td rowspan="4">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_19.gif" width="238" height="285" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="71" alt=""></td>
    </tr>
    <tr>
        <td rowspan="3">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_20.gif" width="242" height="214" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="92" alt=""></td>
    </tr>
    <tr>
        <td rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_21.gif" width="12" height="122" alt=""></td>
        <td colspan="3">
            <a href="mailto: [email protected]"
                onmouseover="window.status='eMail';  return true;"
                onmouseout="window.status='';  return true;">
                <img  src="Bilder/120911_GG_Bauer_Architekten-neue-slices_22.gif" width="521"  height="39" border="0" alt="eMail"></a></td>
        <td colspan="4" rowspan="2">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_23.gif" width="427" height="122" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="39" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_24.gif" width="521" height="83" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="83" alt=""></td>
    </tr>

    <tr>
        <td colspan="10">
            
                
        <td>
            <img src="Bilder/Abstandhalter.gif" width="1" height="132" alt=""></td>
    </tr>

    <tr>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="242" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="12" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="275" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="223" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="23" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="90" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="112" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="113" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="112" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="238" height="1" alt=""></td>
        <td></td>
    </tr>
</table>
<!-- End Save for Web Slices -->


 <div id="footer">
<a href="mailto: [email protected]">
<img src="Bilder/120911_GG_Bauer_Architekten-neue-slices_25.gif"  width="1440" height="132" position="fixed" left="10px" bottom="10px">  </img></a>
      </div>
</body>
</html>
 
Als Fachinformatiker lernt man nicht mal HTML und CSS? Dein Quellcode sieht auch schon ganz danach aus - dachte so was kommt nur bei Nicht-Informatikern zustande :O

Dein Grundansatz für den Seitenaufbau ist schonmal falsch. Du hast offenbar ein Grafikbearbeitungsprogramm verwendet und das Ergebnis dann gesliced - so erstellt man aber keine Webseiten. Das Tabellengerüst was Du nun hast ist voller Bilder. Das bringt keinem etwas. Dein Kunde wird so nicht mal bei Suchmaschinen auffindbar sein, weil ja jegliche Texte auf der Webseite fehlen.

Bevor Du dir über den Footer-Wunsch Gedanken machst, solltest du also den gesamten HTML- und CSS-Code nochmal neu schreiben. Denn ohne einen richtigen HTML-Code wirst Du auch den Wunsch nicht umsetzen können.
 
HTML: 
<td><img src="Bilder/Abstandhalter.gif" width="242" height="1" alt=""></td>

Wenn der Kunde diesen Code sieht und auch nur einen Hauch Ahnung von modernen Webseiten hat, dann seid ihr ihn garantiert los. ;)
 
Ich sage nur: Du brauchst CSS und ein DIV als Footer.

Diesem DIV gibtst du dann folgende Parameter: position: absolute; margin: auto;

Eine Grafik mit nem Grafik-Programm in Slices zu zerschneiden ist nicht mehr zeitgemäß, da es Tabellen erzeugt.
Moderne Websites sollte man mit CSS und DIVs gestalten. Das bringt mehr Flexibilität und wesentlich mehr Formatierungsmöglichkeiten, als bei Tabellen.

Falls du konkrete Beispiele suchst, dann suche in Google mal nach "fixed footer div"

Viel Erfolg
 
heeey :D bitte keine hassvorwürfe und so,
danke leute.
es ist folgendermaßen
unser kunde ist ein designer, dessen kunde die HP will.
WIR bauen nicht die Homepage, sondern nur eine statische HTML-site die sagt "hallöchen, wir bauen grade ne Homepage"
1. ich bin erst seit vorgestern in der beruffschule, nein da haben wir noch kein HTML CSS gelernt
2. Tronjer: "Wenn der Kunde diesen Code sieht und auch nur einen Hauch Ahnung von modernen Webseiten hat, dann seid ihr ihn garantiert los.
icon_wink.gif.pagespeed.ce.x4DjlQWajg.gif
"
NEIN!
der kunde WOLLTE dass wir ein PDF,das er uns schickte, mit Photoshop slicen und so hochladen...joa wir können nix dafür ;) kunde is könig
3. skavenger: "Ich sage nur: Du brauchst CSS und ein DIV als Footer.
Diesem DIV gibtst du dann folgende Parameter: position: absolute; margin: auto"
ich habe doch oben einen css abschnitt mit #Footer
und unten das DIV mit dem footer

ich habe mich doch auch schon durch verschiedene tutorials, foren etc. geschlagen
dort hieß es, dass man NICHT absolute verwenden soll, sich generell von % und px verabschieden soll und "em" verwenden soll, versteh ich nicht..
aber auch wenn ich dem DIV unten "position: absolute; margin: auto" gebe, so stimmt der footer auf der HP nicht...
sieht genauso aus...
das problem ist:
browservorschau der HTML funktioniert, footer klebt am unteren rand.
doch nach dem hochladen aufn server siehts anders aus...die leiste unten ist abgeschnitten, rechts vom "footer" ist ein stück vom hintergrund zu sehen.

im endeffekt soll es so aussehen wie die kopfzeile dieser seite
Referenzen - gregor gestaltet
so soll unser footer sein...
 
Das erreichst Du aber nicht mit dieser Art HTML und CSS. Es ist auch ein Widerspruch zu deinem Auftrag: dein Kunde wollte nur das PDF gesliced haben - mehr nicht. Wieso will er nun solche Besonderheiten eingebaut haben? Wie Du hier schon merkst, musst Du dafür an dem Quellcode einiges ändern oder besser gesagt neu schreiben. Ist das im Auftrag enthalten? ;)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben