Header oben festgemacht, Footer unten festgemacht

Shizmo · 20 Juni 2014

Hi liebe Community,

gerne hätte ich, dass bei meinem Layout der Headerbereich ganz oben festgemacht ist (das habe ich auch soweit hinbekommen) und der Footer eben ganz unten festgemacht ist, also bei allen Auflösungen und der Content-Bereich soll sich halt dementsprechend verschieben, bei einer niedrigen Auflösungen ist es sowieso lang genug, aber wenn man einen größere hat, ist unten immer eine Lücke, hab schon einige Code-Schnipsel ausprobiert die ich so gefunden habe, aber da verlängert sich dann immer nur der Footer, es soll sich aber der Content Bereich verlängern.
Hier der Link zum Design: http://holiday-lienz.bplaced.net/index.php
Und hier der Quelltext:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Holiday Lienz</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="de">
<meta name="keywords" content="Lienz, Ferienwohnung, Hund, Holiday, Ferien, Osttirol, Ferienwohnung mit Hund, Ferienwohnung Osttirol, zentrale Lage">
<meta name="description" content="Ferienwohnung mitten in Lienz in Osttirol, auch mit Hund">
<meta name="robots" content="index,follow">
<meta name="audience" content="alle">
<meta name="page-topic" content="Ferienwohnung">
<meta name="revisit-after" CONTENT="7 days">
<meta http-equiv="imagetoolbar" content="false">
<meta name="copyright" content="(c) Manuel Widmoser">
<style type="text/css">
            html,body {
                    height:100%;
                    background-color:#2b455c;
                    margin-top:0;
                    margin-left:0;
                    margin-bottom:0;
            }
td {Font-Family: Tahoma; font-size: 10pt;  COLOR: #7d7d7d; TEXT-DECORATION: none}
A:visited {Font-Family: Tahoma; font-size: 7pt;  COLOR: #7d7d7d; TEXT-DECORATION: none}
A:link {Font-Family: Tahoma; font-size: 7pt; COLOR: #5c9bce; TEXT-DECORATION: none}
A:hover {Font-Family: Tahoma; font-size: 7pt; COLOR: #5c9bce; TEXT-DECORATION: dashed}
img { border: 0px; }
#one {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_03.jpg);
    width:                  71px;
    height:                 41px;
}
    #one:hover {
    background-image:        url(Bilder/Unbenannt-3_03r.jpg);
}
#two {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_04.jpg);
    width:                  70px;
    height:                 41px;

}
    #two:hover {
    background-image:        url(Bilder/Unbenannt-3_04r.jpg);
}
#three {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_05.jpg);
    width:                  81px;
    height:                 41px;
}
    #three:hover {
    background-image:        url(Bilder/Unbenannt-3_05r.jpg);
}
#four {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_06.jpg);
    width:                  75px;
    height:                 41px;
}
    #four:hover {
    background-image:        url(Bilder/Unbenannt-3_06r.jpg);
}
#five {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_07.jpg);
    width:                  86px;
    height:                 41px;
}
    #five:hover {
    background-image:        url(Bilder/Unbenannt-3_07r.jpg);
}
#six {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_16.jpg);
    width:                  102px;
    height:                 44px;
}
    #six:hover {
    background-image:        url(Bilder/Unbenannt-3_16r.jpg);
}
#seven {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_17.jpg);
    width:                  161px;
    height:                 21px;
}
    #seven:hover {
    background-image:        url(Bilder/Unbenannt-3_17r.jpg);
}
#content {
    width:                  795px;
}
td.c1 {background-image:url(Bilder/Unbenannt-3_01.jpg)}
td.c2 {background-image:url(Bilder/Unbenannt-3_02.jpg)}
td.c3 {background-image:url(Bilder/Unbenannt-3_08.jpg)}
td.c4 {background-image:url(Bilder/Unbenannt-3_09.jpg)}
td.c5 {background-repeat:repeat-y;background-image:url(Bilder/Unbenannt-3_10.jpg);}
td.c6 {background-repeat:repeat-y;background-image:url(Bilder/Unbenannt-3_11.jpg);}
td.c7 {background-repeat:repeat-y;background-image:url(Bilder/Unbenannt-3_12.jpg);}
td.c8 {background-repeat:repeat-y;background-image:url(Bilder/Unbenannt-3_13.jpg);}
td.c9 {background-image:url(Bilder/Unbenannt-3_14.jpg)}
td.c10 {background-image:url(Bilder/Unbenannt-3_15.jpg)}
td.c11 {background-image:url(Bilder/Unbenannt-3_16.jpg)}
td.c12 {background-image:url(Bilder/Unbenannt-3_18.jpg)}
td.c13 {background-image:url(Bilder/Unbenannt-3_19.jpg)}
td.c14 {background-image:url(Bilder/Unbenannt-3_17.jpg)}
</style>
</head>

<body>
<table id="Tabelle_01" align="center" width="1264" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td colspan="13" width="1264" height="220" class="c1">
            </td>
    </tr>
    <tr>
        <td width="357" height="41" colspan="2" class="c2">
            </td>
        <td bgcolor="#FFFFFF">
            <div><a id="one" href="?id=home"></a></div></td>
        <td bgcolor="#FFFFFF">
            <div><a id="two" href="?id=fotos"></a></div></td>
        <td bgcolor="#FFFFFF">
            <div><a id="three" href="?id=wetter"></a></div></td>
        <td bgcolor="#FFFFFF">           
            <div><a id="four" href="?id=preise"></a></div></td>
        <td bgcolor="#FFFFFF">           
            <div><a id="five" href="?id=kontakt"></a></div></td>
        <td colspan="6" width="524" height="41" class="c3">
            </td>
    </tr>
    <tr>
        <td colspan="13" width="1264" height="54" class="c4">
            </td>
    </tr>
    <tr>
        <td width="116" class="c5"></td>
     <td colspan="8" width="910" class="c6" valign="top"><div id="content"><?
if (!isset($_GET['id'])) { $_GET['id']="home"; } 
if (file_exists($_GET['id'].".php")) { include($_GET['id'].".php"); } else { echo " 

<b>Error 404</b> ";  } 
?></div></td>
        <td colspan="2" width="184" class="c7" valign="top"><? include("anfrage.php"); ?>
        <br>
        <? include("anschauen.php"); ?>

</td>
        <td colspan="2" width="54" height="428" class="c8">
            </td>
    </tr>
    <tr>
        <td colspan="13" width="1264" height="163" class="c9">
            </td>
    </tr>
    <tr>
        <td colspan="8" rowspan="2" width="968" height="44" class="c10" valign="bottom">
            </td>
        <td colspan="2" rowspan="2" class="c11">
            <div><a id="six" href="http://www.facebook.com" target="_blank"></a></div>
            </td>
        <td colspan="2" class="c14">
            <div><a id="seven" href="mailto:m.widmoser@gmail.com"></a></div>
            </td>
        <td rowspan="2" width="33" height="44" class="c12">
            </td>
    </tr>
    <tr>
        <td colspan="2" width="161" height="23" class="c13">
            </td>
    </tr>
    <tr>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="116" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="241" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="71" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="70" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="81" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="75" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="86" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="228" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="58" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="44" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="140" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="21" height="1" alt=""></td>
        <td>
            <img src="Bilder/Abstandhalter.gif" width="33" height="1" alt=""></td>
    </tr>
</table>
</body>
</html>

Danke schonmal für eure Hilfe :)

Liebe Grüße
Manuel

Tronjer · 20 Juni 2014

Das ist ein Tabellenkonstrukt à la 1997 mit teilweise ungültigen Tags, da gibt es nichts zu flicken.

Zur Lösung deines Problems musst du schon eine Seite bauen, die semantisch dem heutigen Stand entspricht. Am besten, du besorgst dir erstmal ein Buch über HTML/CSS und eignest dir Grundlagenwissen an.

Shizmo · 20 Juni 2014

Also die Tags sind jetzt alle gültig (hab den Code nochmal geändert).

Okay also ist es so nicht möglich?
Versteh nicht so ganz, was so schlimm an den Tabellen ist, immerhin funktioniert so alles tadellos.

bdt600 · 20 Juni 2014

Tabellen sind für tabellarische Daten gedacht und nicht zum Vergewaltigen von Layouts. Klar funktioniert das damit auch, aber immer nach dem Motto: "Der Meister will's kaum glauben, auch mit 'nem Hammer kann man schrauben"

Siehe http://www.css4you.de/wslayout1/index.html

Tronjer · 20 Juni 2014

Shizmo schrieb:
Also die Tags sind jetzt alle gültig (hab den Code nochmal geändert).

Versteh nicht so ganz, was so schlimm an den Tabellen ist, immerhin funktioniert so alles tadellos.

Es funktioniert ja eben nicht, wenn es um das Styling geht, siehe dein Problem. Aus dem Grunde ist man bereits vor langer Zeit vom Tabellenlayout abgerückt.

Shizmo · 20 Juni 2014

Also, ich habs mal mit divs versucht und es schaut eigentlich ganz gut aus, wie bekomme ich es jetzt hin, dass der Content Bereich automatisch mit verlängert wird, der Footer ist schonmal am Boden sowie es sein soll. Achja und mittig sollte das Ganze auch noch sein:
http://holiday-lienz.bplaced.net/index.php

Hier der neue Code:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="de">
<meta name="keywords" content="Lienz, Ferienwohnung, Hund, Holiday, Ferien, Osttirol, Ferienwohnung mit Hund, Ferienwohnung Osttirol, zentrale Lage">
<meta name="description" content="Ferienwohnung mitten in Lienz in Osttirol, auch mit Hund">
<meta name="robots" content="index,follow">
<meta name="audience" content="alle">
<meta name="page-topic" content="Ferienwohnung">
<meta name="revisit-after" CONTENT="7 days">
<meta http-equiv="imagetoolbar" content="false">
<meta name="copyright" content="(c) Manuel Widmoser">
<title>Holiday Lienz</title>
<style type="text/css">
* {
    margin: 0;
    padding: 0;
    Font-Family: Tahoma;
    font-size: 10pt; 
    color: #7d7d7d;
    text-decoration: none;
A:visited {Font-Family: Tahoma; font-size: 7pt;  COLOR: #7d7d7d; TEXT-DECORATION: none}
A:link {Font-Family: Tahoma; font-size: 7pt; COLOR: #5c9bce; TEXT-DECORATION: none}
A:hover {Font-Family: Tahoma; font-size: 7pt; COLOR: #5c9bce; TEXT-DECORATION: dashed}
}
html,body {
    height:100%;
    background-color:#2b455c;
    margin-top:0;
    margin-bottom:0;

}

#one {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_03.jpg);
    width:                  71px;
    height:                 41px;
    float:                    left;
}
    #one:hover {
    background-image:        url(Bilder/Unbenannt-3_03r.jpg);
}
#two {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_04.jpg);
    width:                  70px;
    height:                 41px;
    float:                    left;

}
    #two:hover {
    background-image:        url(Bilder/Unbenannt-3_04r.jpg);
}
#three {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_05.jpg);
    width:                  81px;
    height:                 41px;
    float:                    left;
}
    #three:hover {
    background-image:        url(Bilder/Unbenannt-3_05r.jpg);
}
#four {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_06.jpg);
    width:                  75px;
    height:                 41px;
    float:                    left;
}
    #four:hover {
    background-image:        url(Bilder/Unbenannt-3_06r.jpg);
}
#five {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_07.jpg);
    width:                  86px;
    height:                 41px;
    float:                    left;
}
    #five:hover {
    background-image:        url(Bilder/Unbenannt-3_07r.jpg);
}
#six {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_16.jpg);
    width:                  102px;
    height:                 44px;
}
    #six:hover {
    background-image:        url(Bilder/Unbenannt-3_16r.jpg);
}
#seven {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_17.jpg);
    width:                  161px;
    height:                 21px;
}
    #seven:hover {
    background-image:        url(Bilder/Unbenannt-3_17r.jpg);
}
#textcontent {
    width:                  795px;
    padding-left:            100px;
    margin-top:                0px;
    float:                    left;
}
#sidecontent {
    width:                  176px;
    float:                    left;
    padding-left:            126px;
    margin-top:                0px;
}
#header {
    width:                    1242px;
    height:                    333px;
    background-image:        url(Bilder/header.jpg);
    margin-top:                0px;
}
#content {
    width:                    1242px;
    display:                block;
    background-image:        url(Bilder/content.jpg);
    background-repeat:        repeat-y;
    float:                    left;
}
#navigation {
    margin-left:            350px;
    padding-top:            220px;
}
#footer {
    width:                    1242px;
    height:                    206px;
    background-image:        url(Bilder/footer.jpg);
    position: absolute;
    bottom: 0;
}
.clear {
    clear: both;
}
.textinput {
    width:110px;
    height:16px;
    color: #7d7d7d;
    font-size: 11px;
    border: 1px solid #c0c0c0;
    background-color: #f5f5f5;
}
.textarea {
    width:110px;
    color: #7d7d7d;
    font-size: 11px;
    border: 1px solid #c0c0c0;
    background-color: #f5f5f5;
    resize: none;
}
</style>
</head>
<body>
<div id="header"><div id="navigation">
<a id="one" href="?id=home"></a><a id="two" href="?id=fotos"></a><a id="three" href="?id=wetter"></a><a id="four" href="?id=preise"></a><a id="five" href="?id=kontakt"></a></div>
</div>
<div id="content">
  <div id="textcontent"><?
if (!isset($_GET['id'])) { $_GET['id']="home"; }
if (file_exists($_GET['id'].".php")) { include($_GET['id'].".php"); } else { echo "

<b>Error 404</b> ";  }
?></div>
  <div id="sidecontent"><? include("anfrage.php"); ?>
        <br>
        <? include("anschauen.php"); ?></div>
</div>
<div class="clear" id="footer"></div>
</body>
</html>

WhispR · 20 Juni 2014

Hi,
hier ists ganz einfach erklärt wie man das am Besten macht: http://html-einfach.de/visuelles/css_design_textboxen.php

Zum zentrieren: Entweder ein Div um alles und dieses mit position relative und margin:auto; zentrieren
Oder den Content Hintergrund als Seitenhintergrund nehmen. Dann schaut überall da, wo die Lücke ist der Hintergrund nochmal durch

P

MrMurphy · 20 Juni 2014

Hallo,

ich befürchte, du hast etwas falsch verstanden. Tronjer schrieb

Zur Lösung deines Problems musst du schon eine Seite bauen, die semantisch dem heutigen Stand entspricht. Am besten, du besorgst dir erstmal ein Buch über HTML/CSS und eignest dir Grundlagenwissen an.

Es geht also nicht nur um das Tabellenlayout, das der Lösung deines Wunsches entgegensteht, sondern um den gesamten Quellcode. Den musst du erst einmal semantisch korrekt erstellen.

Dazu gehört zum Beispiel auch, das Text immer Text ist und nicht als Grafik angezeigt wird. Außerdem werden Rahmen heutzutage nicht mehr als Grafiken angezeigt, sondern per CSS mit border.

Dein verwendetes XHTML 1.0 ist bereits 2006 zu Grabe getragen worden und wird nicht mehr weitererentwickelt. Das zeigen die Browser nur noch als Erinnerungswert an und irgendwann wird es als Altballast von den Browsern ignoriert werden. Neue Seiten sollten deshalb mit HTML5 erstellt werden.

Wenn du eine aktuelle Seite mit all ihren Möglichkeiten erstellen willst wirst du nicht darum herumkommen, erst einmal die Grundlagen vom aktuellen HTML5 und CSS3 zu lernen.

Edith:

Als erstes müssen Sie eine Textbox in einem Grafikbearbeitungsprogramm erstellen

Autsch, das ist veraltete Technik, die nicht mehr angewandt werden sollte, schon gar nicht bei neuen Seiten.

Gruss

MrMurphy

Shizmo · 20 Juni 2014

Hi, die Content-Box ist auch variabel, aber ich will dass sie immer am Footer anschließt, egal bei welcher Auflösung (siehe erster Post).

MfG

MrMurphy · 20 Juni 2014

Hallo,

egal bei welcher Auflösung

Das geht nicht so lange du Grafiken als Rahmen nutzt.

Gruss

MrMurphy

Shizmo · 20 Juni 2014

MrMurphy schrieb:
Hallo,

ich befürchte, du hast etwas falsch verstanden. Tronjer schrieb

Es geht also nicht nur um das Tabellenlayout, das der Lösung deines Wunsches entgegensteht, sondern um den gesamten Quellcode. Den musst du erst einmal semantisch korrekt erstellen.

Dazu gehört zum Beispiel auch, das Text immer Text ist und nicht als Grafik angezeigt wird. Außerdem werden Rahmen heutzutage nicht mehr als Grafiken angezeigt, sondern per CSS mit border.

Dein verwendetes XHTML 1.0 ist bereits 2006 zu Grabe getragen worden und wird nicht mehr weitererentwickelt. Das zeigen die Browser nur noch als Erinnerungswert an und irgendwann wird es als Altballast von den Browsern ignoriert werden. Neue Seiten sollten deshalb mit HTML5 erstellt werden.

Wenn du eine aktuelle Seite mit all ihren Möglichkeiten erstellen willst wirst du nicht darum herumkommen, erst einmal die Grundlagen vom aktuellen HTML5 und CSS3 zu lernen.

Gruss

MrMurphy

Was ist jetzt das Problem, weil am Anfang das hier steht?:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Das ist eine automatische Ausgabe vom Dreamweaver.
Der HTML Code sin
Ansonsten sind es nur CSS Werte und danach ein paar div Boxen, mehr ist's nicht.

MrMurphy schrieb:
Hallo,

Das geht nicht so lange du Grafiken als Rahmen nutzt.

Gruss

MrMurphy

Was? Das glaub ich nicht, das ist eine Hintergrundgrafik im Content-Bereich, die sich ja unendlich repeaten kann. Daher nutze ich ja keine eigene Grafik als Rahmen. Mit ner Hintergrundfarbe wirds wohl auch gehen, warum soll es dann mit einer Grafik nicht gehen.
Das Layout besteht aus 3 Grafik, Header, Mitte und Footer (und halt extra noch die Navigation Buttons).

Also ich wette ich bekomms früher oder später noch hin, aber danke für deine Hilfe...

MrMurphy · 20 Juni 2014

Hallo,

Das ist eine automatische Ausgabe vom Dreamweaver.

Nein, das stimmt nicht. Ich kenne den DW selbst sehr gut und weiß deshalb, das er nur das macht, was du ihm vorgibst. Den Doctype für XHTML vergibt er also nur, wenn du ihn auch ausgewählt hast. Wenn du mit den DW arbeiten willst solltest du vorher die Bedienung lernen. Die ist nichts für Anfänger.

Außerdem habe ich das Gefühl, das die anderen Hilfswilligen noch gar nicht erkannt haben, was du alles in Grafiken untergebracht hast, weil sie sich das heutzutage schlicht nicht mehr vorstellen können. Ansonsten hätten sie dich in der Mehrheit auch schon darauf hingewiesen, das es so mit einem flexiblen Layout nichts werden kann. Zudem sind alle textlichen Schlüsselinformationen als Grafik eingefügt.

Gruss

MrMurphy

Shizmo · 20 Juni 2014

MrMurphy schrieb:
Hallo,

Nein, das stimmt nicht. Ich kenne den DW selbst sehr gut und weiß deshalb, das er nur das macht, was du ihm vorgibst. Den Doctype für XHTML vergibt er also nur, wenn du ihn auch ausgewählt hast. Wenn du mit den DW arbeiten willst solltest du vorher die Bedienung lernen. Die ist nichts für Anfänger.

Außerdem habe ich das Gefühl, das die anderen Hilfswilligen noch gar nicht erkannt haben, was du alles in Grafiken untergebracht hast, weil sie sich das heutzutage schlicht nicht mehr vorstellen können. Ansonsten hätten sie dich in der Mehrheit auch schon darauf hingewiesen, das es so mit einem flexiblen Layout nichts werden kann. Zudem sind alle textlichen Schlüsselinformationen als Grafik eingefügt.

Gruss

MrMurphy

Nur weil ich den falschen Doctype ausgewählt habe, machst du mich so runter? Toll dass du so gut bist und alles kannst, aber anstatt helfen kannst du auch nur rummotzen.
Also ich weiß echt nicht was dein Problem ist, es sind gerade mal DREI Grafiken (+die Navigationselemente).
Naja aufjedenfall hab ichs hinbekommen, aber trotzdem danke für deine super tolle Hilfe, dass es nicht funktionieren wird.

Lg

MrMurphy · 20 Juni 2014

Hallo,

ich will dich nicht ärgern sondern davor bewahren eine veraltete Schrottseite zu erstellen.

dass es nicht funktionieren wird.

Dir ist schon aufgefallen, das weder dein gesamter Text noch deine Bewertungssternchen angezeigt werden? Außer du wählst einen kleinen Zoom-Faktor?

Gruss

MrMurphy

Shizmo · 20 Juni 2014

MrMurphy schrieb:
ich will dich nicht ärgern sondern davor bewahren eine veraltete Schrottseite zu erstellen.

Danke :)

MrMurphy schrieb:
Dir ist schon aufgefallen, das weder dein gesamter Text noch deine Bewertungssternchen angezeigt werden? Außer du wählst einen kleinen Zoom-Faktor?

Haha, ja hast recht, bei mir bei 100% fällt es gar nicht auf, hab grad rangezoomt und alles verschwindet.
Aber ich glaub ich bin schon ganz nah dran, irgendwie muss es doch gehen...

Ich häng nochmal den Code an, vielleicht hat ja wer ne Idee:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="de">
<meta name="keywords" content="Lienz, Ferienwohnung, Hund, Holiday, Ferien, Osttirol, Ferienwohnung mit Hund, Ferienwohnung Osttirol, zentrale Lage">
<meta name="description" content="Ferienwohnung mitten in Lienz in Osttirol, auch mit Hund">
<meta name="robots" content="index,follow">
<meta name="audience" content="alle">
<meta name="page-topic" content="Ferienwohnung">
<meta name="revisit-after" CONTENT="7 days">
<meta http-equiv="imagetoolbar" content="false">
<meta name="copyright" content="(c) Manuel Widmoser">
<title>Holiday Lienz</title>
<style type="text/css">
* { 
    margin: 0; 
    padding: 0;
    Font-Family: Tahoma; 
    font-size: 10pt;  
    color: #7d7d7d; 
    text-decoration: none;
}

a:link {
    color: #5c9bd0;
    text-decoration: none;
}
a:visited {
    color: #5c9bd0;
    text-decoration: none;
}
a:hover {
    color: #5c9bd0;
    text-decoration: dashed;
}

html,body {
    height:100%;
    background-color:#33465c;
    margin-top:0;
    margin-bottom:0;

}
#box{
    min-height: 100%;
    height:auto !important;
    height:100%; /* IE */
    position: relative;
    background-image: url(Bilder/content.jpg);
    margin:0 auto;
    width: 1242px;
}
#inbox
{
    height:100%;
    overflow:hidden;
}
#one {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_03.jpg);
    width:                  71px;
    height:                 41px;
    float:                    left;
}
    #one:hover {
    background-image:        url(Bilder/Unbenannt-3_03r.jpg);
}
#two {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_04.jpg);
    width:                  70px;
    height:                 41px;
    float:                    left;

}
    #two:hover {
    background-image:        url(Bilder/Unbenannt-3_04r.jpg);
}
#three {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_05.jpg);
    width:                  81px;
    height:                 41px;
    float:                    left;
}
    #three:hover {
    background-image:        url(Bilder/Unbenannt-3_05r.jpg);
}
#four {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_06.jpg);
    width:                  75px;
    height:                 41px;
    float:                    left;
}
    #four:hover {
    background-image:        url(Bilder/Unbenannt-3_06r.jpg);
}
#five {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_07.jpg);
    width:                  86px;
    height:                 41px;
    float:                    left;
}
    #five:hover {
    background-image:        url(Bilder/Unbenannt-3_07r.jpg);
}
#six {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_16.jpg);
    width:                  102px;
    height:                 44px;
    float:                    left;
}
    #six:hover {
    background-image:        url(Bilder/Unbenannt-3_16r.jpg);
}
#seven {
    display:                block;
    background-image:       url(Bilder/Unbenannt-3_17.jpg);
    width:                  161px;
    height:                 21px;
    float:                    left;
}
    #seven:hover {
    background-image:        url(Bilder/Unbenannt-3_17r.jpg);
}
#textcontent {
    width:                  795px;
    padding-left:            100px;
    margin-top:                0px;
    float:                    left;
}
#sidecontent {
    width:                  176px;
    float:                    left;
    padding-left:            126px;
    margin-top:                0px;
}
#header {
    width:                    1242px;
    height:                    333px;
    background-image:        url(Bilder/header.jpg);
    margin-top:                0px;
}
#content {
    width:                    1242px;
    display:                block;
    background-image:        url(Bilder/content.jpg);
    background-repeat:        repeat-y;
    float:                    left;
}
#navigation {
    margin-left:            350px;
    padding-top:            220px;
}
#footer {
    width:                    1242px;
    height:                    206px;
    background-image:        url(Bilder/footer.jpg);
    position: absolute;
    bottom: 0;
}
.clear {
    clear: both;
}
.textinput {
    width:110px; 
    height:16px; 
    color: #7d7d7d; 
    font-size: 11px; 
    border: 1px solid #c0c0c0; 
    background-color: #f5f5f5;
}
.textarea {
    width:110px; 
    color: #7d7d7d; 
    font-size: 11px; 
    border: 1px solid #c0c0c0; 
    background-color: #f5f5f5; 
    resize: none;
}
#footernavi {
    margin-left:            957px;
    padding-top:            162px;
}
</style>
</head>
<body>
<div id="box"><div id="inbox">
<div id="header"><div id="navigation">
<a id="one" href="?id=home"></a><a id="two" href="?id=fotos"></a><a id="three" href="?id=wetter"></a><a id="four" href="?id=preise"></a><a id="five" href="?id=kontakt"></a></div>
</div>
<div id="content">
  <div id="textcontent"><?
if (!isset($_GET['id'])) { $_GET['id']="home"; } 
if (file_exists($_GET['id'].".php")) { include($_GET['id'].".php"); } else { echo " 

<b>Error 404</b> ";  } 
?></div>
  <div id="sidecontent"><? include("anfrage.php"); ?>
        <br>
        <? include("anschauen.php"); ?></div>
</div></div>
<div class="clear" id="footer"><div id="footernavi"><a id="six" href="http://www.facebook.com" target="_blank"></a><a id="seven" href="mailto:m.widmoser@gmail.com"></a></div></div>
</div>
</body>
</html>

Liebe Grüße :)

Shizmo · 20 Juni 2014

Jetzt funktionierts, glaub ich zumindest

HTML:

#inbox{
    min-height: 955px;
    height:100%;
    overflow:hidden;
}

Bitte testen: http://holiday-lienz.bplaced.net/index.php

Liebe Grüße

Header oben festgemacht, Footer unten festgemacht

Shizmo

Neues Mitglied

Tronjer

Senior HTML'ler

Shizmo

Neues Mitglied

bdt600

Guest

Tronjer

Senior HTML'ler

Shizmo

Neues Mitglied

WhispR

Mitglied

MrMurphy

Senior HTML'ler

Shizmo

Neues Mitglied

MrMurphy

Senior HTML'ler

Shizmo

Neues Mitglied

MrMurphy

Senior HTML'ler

Shizmo

Neues Mitglied

MrMurphy

Senior HTML'ler

Shizmo

Neues Mitglied

Shizmo

Neues Mitglied

Neueste Beiträge