Div fest auf Seite positionieren

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Div fest auf Seite positionieren

Beitrag von yourmy » Di 21. Jul 2015, 09:02

Hallo Ihr,
habe ich im Kurs oder im Forum übersehen, wie man z.B. den Footer fest auf einer Seite positionieren kann, während sich der Rest dahinter normal scrallen lässt?
Habe eine Seite mit Kopf, Hori Navi und Inhalt mit einer festgelegten Breite und Außenabstände auf auto eingestellt.
Vermute mal es braucht ein Div außerhalb der Seite, aber weder mit der Einstellung "fest" noch mit "statisch" bekomme ich das Ergebnis.
Die Antwort hat keine Eile, würde mich aber freuen.
Lieben Gruß
yourmy

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Re: Div fest auf Seite positionieren

Beitrag von yourmy » Di 21. Jul 2015, 09:27

habe gerade gesehen, dass das Div mit der Positionierung "fest" mit den Außenabständen "auto" , unten: 0px, zwar garnicht nicht im Kompozer angezeigt wird, aber in der Vorschau. Jedoch nicht zentriert wie die Seite, sondern klebt unten links. Wie bekomme ich es zentriert?
Danke und Gruß
yourmy

mich78
Beiträge: 46
Registriert: Sa 11. Okt 2014, 22:08

Re: Div fest auf Seite positionieren

Beitrag von mich78 » Di 21. Jul 2015, 13:59

Hallo Yourmy
Wenn du deinen Quelltext dazu posten würdest, könnte man schauen was fehlt bzw. nicht passt.

Grundsätzlich läuft es so, dass man der Seite eine Höhe von 100% gibt, und den Footer von unten mit einem negativen Abstand herein zieht.
Beachte das du bei einer Höhenvergabe bei Wurzelelement (html) anfangen musst. Wenn du nur body 100% Höhe gibst, hat body 100% Höhe des Elternelementes (also html). Für die Höhe des Footers vergibst du dann ein padding im #inhalt (oder wie der bei dir auch immer heist). Dem #footer gibst du einem seiner Höhe entsprechenden negativen Abstand von oben also z.b. margin-top: -200px;

Zum Verständnis kannst du einfach mal nach "Sticky Footer" googlen. Ich denke das ich uch im alten Forum schon mal was dazu geschrieben habe.

camouflage1984
Beiträge: 255
Registriert: Di 19. Aug 2014, 14:34

Re: Div fest auf Seite positionieren

Beitrag von camouflage1984 » Mi 22. Jul 2015, 23:39

Hallo Yourmy

Hier http://www.camouflage1984.de/sticky-footer.php kannst du sehen wie man einen sticky footer erstellt.
Lachen ist gesund :-)
camouflage1984.de Webseite / wzp-galipix Das Galerie Script / wzp-cms Das einfache CMS / wzp-webdesign

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Re: Div fest auf Seite positionieren

Beitrag von yourmy » Do 23. Jul 2015, 12:07

Lieber mich78,
danke für deine Antwort.
Auf das alte Forum habe ich scheinbar keinen Zugriff. Hab eine Seite von Camouflage1984 gefunden mit einer Anleitung.
Aber Sticky Footer scheint nicht das zu sein, was ich gerne gehabt hätte. Ich hatte mir vorgestellt, dass der Footer unten mittig immer zu sehen ist, egal wie man sich im inhalt bewegt.
Aber als Html-Laie lasse ich diese Idee wohl lieber fallen.
Nun weiß ich garnicht wie man den Quelltext hier am besten einfügt. Einfach ins Feld rein?
Lieben Gruß
Myriam

camouflage1984
Beiträge: 255
Registriert: Di 19. Aug 2014, 14:34

Re: Div fest auf Seite positionieren

Beitrag von camouflage1984 » Do 23. Jul 2015, 20:09

Hallo Myriam

Das was du haben möchtest realisierst du mit

Code: Alles auswählen

position:absolute;
Hier http://aktuell.de.selfhtml.org/artikel/css/footer/ kannst du dir ein Beispiel anschauen.

Den Quelltext setzt du in die

Code: Alles auswählen

[code] Tags 
[/code] einfach oben auf Code klicken und den Quelltext darin einfügen.
Lachen ist gesund :-)
camouflage1984.de Webseite / wzp-galipix Das Galerie Script / wzp-cms Das einfache CMS / wzp-webdesign

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Re: Div fest auf Seite positionieren

Beitrag von yourmy » Fr 24. Jul 2015, 16:33

Lieben Dank Camouflage 1984,
einfach mit der Einstellung "absolut" habe ich das Ergebnis bei meiner Seite nicht hinbekommen.
Die Seite die du verlinkt hast fand ich sehr interessant, aber mit der Umsetzung, dass es sowohl für Firefox, als auch Explorer tauglich ist, fühlte ich mich überfordert.
Vermutlich habe ich schon zu viel rumgebastelt an der Seite, dass das nicht so einfach geht.

Nachdem ich nun aber doch noch etwas weiter probiert habe, ist mir eine Lösung gelungen.
Den I.Abstand von "Seite" habe ich auf unten auf 30px gestellt.
Dem Footer habe ich eine Breite: 100% und eine Höhe: 30px gegeben.
Dann habe ich in den Offsets: r/u/l 0px eingegeben - position: fest.

Nun hoffe ich, dass diese Eigenkreation nun auch dauerhaft und störungsfrei funktioniert.
Falls es jemanden interessiert, füge ich den Quellcode mal hier ein.

Lieben Gruß,
yourmy

P.S. Wie läuft das eigentlich hier? Ist das ganze auf Spenden aufgebaut? Würde als Dankeschön gerne etwas überweisen.

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Re: Div fest auf Seite positionieren

Beitrag von yourmy » Fr 24. Jul 2015, 16:36

Code: Alles auswählen

<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Klang, Massage, Therapie und Meditation</title>
<meta content="Myriam Gorgi" name="author">
<link rel="stylesheet" href="styles_de_klang.css" type="text/css">
</head>
<body>
<div id="seite">
<div id="kopf"><em>Meditation, Klangschalenmassage, Klangmassage,
Kampfkunst, Karate, Tai
Ji Quan, Qi Gong, Chi Gong, Tai Chi, Entspannung, Klangmeditation,
Klangreisen,</em><em id="em"> Klangtherapie, Hausbesuch, Massage,
Tuina, Gong, Moers,
Krefeld, Duisburg<br>
</em> <br>
<img class="ülinks" style="width: 100px; height: 137px;"
alt="Klang- Massage & Meditation. Gong & Klangschalen"
src="bilder/gong_und_klangschalen_klein.jpg"><br>
<img style="width: 200px; height: 22px;"
alt="Klang - Massage & Meditation" src="images/klang_und_massage.png">
</div>
<div id="navi">
<ul>
<li><a href="index.html">WILLKOMMEN</a><br>
<ul>
<li><a href="klang_und_massage.html">Klang & Massage</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a target="_blank" href="zsr.html">Zen Shorin Ryu</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
</ul>
</li>
<li>Klang<br>
<ul>
<li><a href="instrumente.html">Instrumente</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="wirkung.html">Wirkung</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
</ul>
</li>
<li>Angebot<br>
<ul>
<li><a href="klangmassagen.html">Klangmassagen</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="tuina.html">Tuina Massage</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="ohrkerzen.html">Ohrkerzen</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="gruppen.html">Gruppen</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="themen.html">Themen</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="hausbesuche.html">Hausbesuche</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
</ul>
</li>
<li>Aktuell<br>
<ul>
<li><a href="neuigkeiten.html">Neuigkeiten</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="termine.html">Termine</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
</ul>
</li>
<li>Allgemein<br>
<ul>
<li><a href="gutscheine.html">Gutscheine</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a target="_blank" href="www.klangeinheit.ch">ch</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="kontakt.html">Kontakt</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="myriam_gorgi.html">Myriam Gorgi</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="erfahrungen.html">Erfahrungen</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="preise.html">Ausgleich</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="galerie.html">Galerie</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
<li><a href="links.html">Links</a><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</li>
</ul>
</li>
</ul>
</div>
<div id="inhalt"><br>
<h2>
KLANG & MASSAGE</h2>
<h3><img class="links" style="width: 150px; height: 225px;"
alt="Glocke und VAjra" src="bilder/glocke_und_vajra.jpg">Lassen Sie
Ihren Selbstheilungskräften freien Lauf, während Sie sich mit den
Klängen eine tiefe Entspannung gönnen.
</h3>
Je mehr wir uns erlauben den Fluss des Lebens wahrzunehmen und frei
durch uns fließen zu
lassen, desto leichter kann Regeneration und Heilung geschehen.<br>
<br>
Bei den meisten von uns ist das Tagesbewusstsein noch vom Verstand
und Bedürfnissen dominiert, welche wir versuchen durch äußerliche
Gegebenheiten und Personen zu stillen, was zumeist zur Folge hat, dass
wir den Kontakt
zu unserer eigenen Quelle und der wahren Qualität des jetzigen Momentes
nicht mehr fühlen. Es entstehen Widerstände deren Aufrechterhaltung
viel Energie verbrauchen und die meistens ein Ungleichgewicht in
unserem System mit sich bringen.<br>
<br>
Der Schlaf und die Tiefenentspannung sind Räume in denen unser Verstand
Pause haben darf, weil er die Ganzheit nicht erfassen kann und in
diesen
Bereichen nicht mehr die Oberhand haben kann. Wir öffnen uns
wertungsfrei den selbstregulierenden Energien, die uns ordnen und
harmonisieren und somit bei der Gesundung und Vitalisierung
unterstützen.<img class="rechts" style="width: 150px; height: 234px;"
alt="Einkehr und Öffnung" src="bilder/einkehr_und_oeffnung.jpg"><br>
<br>
Die Klangschalenmassage ist ein effektives Werkzeug zur
Tiefenentspannung, einzeln oder auch zu zweit. Aber auch in Gruppen
oder in Kombination mit einer Ohrkerzenbehandlung oder Tuina-Massage
gönnen Sie sich einen erholsamen Raum, in dem Sie in Kontakt mit Ihren
Ressourcen kommen und Energie aus sich selbst schöpfen.<br>
Dieser Zustand kann mit Wiederholung und Achtsamkeit in den Alltag
dauerhaft integriert werden.<br>
<br>
Alle Dienste werden auch mobil angeboten, privat daheim oder in einer
Institution.<br>
Schauen Sie was für Sie passt.<br>
<br>
<br>
<br>
<br>
<br>
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <br>
</div>
<div>&nbsp;<br>
</div>
</div>
<div id="footer">KLANGEINHEIT&nbsp; +&nbsp; Myriam Gorgi&nbsp; +&nbsp;
Tel: 02841 - 518 20 64 &nbsp; + &nbsp; <a href="myriam@klangeinheit.de">myriam
[ät] klangeinheit.de</a>&nbsp;
</div>
</body>
</html>


camouflage1984
Beiträge: 255
Registriert: Di 19. Aug 2014, 14:34

Re: Div fest auf Seite positionieren

Beitrag von camouflage1984 » Fr 24. Jul 2015, 17:21

Hallo yourmy

Da solltest du auch die css verlinken ;) , so sieht man nicht viel.
camouflage1984 hat geschrieben:P.S. Wie läuft das eigentlich hier? Ist das ganze auf Spenden aufgebaut? Würde als Dankeschön gerne etwas überweisen.
Es ist nicht auf spenden aufgebaut, du kannst aber auf der Homepage von Kompozer ab und an einen Werbelink anklicken, da erhält man für jeden Klick ein paar cent ;), und du kannst weiter im Forum aktiv sein. Vielleicht schreibt ja die Chefin auch was rein :mrgreen:
Lachen ist gesund :-)
camouflage1984.de Webseite / wzp-galipix Das Galerie Script / wzp-cms Das einfache CMS / wzp-webdesign

yourmy
Beiträge: 18
Registriert: Fr 6. Feb 2015, 12:07

Re: Div fest auf Seite positionieren

Beitrag von yourmy » Fr 24. Jul 2015, 20:48

Ok, gerne. Aber wie ? :oops:

Antworten