Jetzt Mitglied werden
Kostenlos registrieren und die vielen Vorteile der Webmasterpro-Mitgliedschaft nutzen.
Forum - Entwicklung
- Markup (HTML, XML, etc.) und CSS
- Skriptsprachen (PHP, Javascript, etc.)
- Datenbanken (SQL)
- CMS und Frameworks
- Flash und ActionScript
Info: Der Stern signalisiert, dass neue Beiträge vorhanden sind.
Alle Foren - Übersicht
Portal aktuelle Themen
Design aktuelle Themen
Server aktuelle Themen
- Webhosting und Webspace
- Betriebssysteme (Windows, Linux, etc.)
- Serveradministration
- Überwachung, Sicherheit und Backups
Management aktuelle Themen
Über Webmasterpro.de
Das Portal wird betrieben und entwickelt durch die Team23 Agentur. Die Augsbuger Agentur hat sich auf Community Software und die Entwicklung von Webportalen spezialisiert.
Markup (HTML, XML, etc.) und CSS - Forum
Derzeit sind Sie als Gast in unserem Forum aktiv. Für das Schreiben registrieren Sie sich bitte. Unser Forum ist eine Austauschplattform für Webworker zum Kommunizieren, Helfen, Informieren und Hilfe finden. Auf der rechten Seiten finden Sie eine Forenübersicht über alle Bereiche des Webmaster-Forums. Unterhalb finden Sie alle aktuellen Themen.
In diesem Forum sollen begleitend zu unserem CSS Portal und HTML-Bereich konkrete Fragen zu HTML und CSS diskutiert werden. Bitte immer die Suchfunktion nutzen bevor du eine Frage stellst.
div feste Höhe oder bis ganz nach unten
Ahnungsloser,
am Freitag
den 28.10.2011
um 13:58:50
Hallo,
Ich bin grad echt überfordert! Erstmal eine kleine Skizze:
Also der Haupt div ist ja kein Problem.
Nur der blaue macht mir Probleme. Ich möchte, dass wenn der Haupt div nicht hoch ist (halbes Browserfenster oder so), der blaue div vom Haupt div bis zum unteren Rand vom Browserfenster geht. Wenn der Haupt div aber höher ist als das Brwoserfenster soll der footer nur unter dem Haupt div also nach dem Runterscrollen mit einer Höhe con 50px angezeigt werden.
Ich hoffe das ist verständlich und mit CSS überhaupt möglich :)
Grüße
Ninos Ego,
am Samstag
den 12.11.2011
um 21:24:32
Soweit ich weiß ist das nicht mit css möglich, da du via css Zahlen (Pixelangaben und co) nicht subtrahieren kannst, oder gar die Browserhöhe herausfinden kannst... (Sollte man mal eventuell mit einer neuen css Version einführen^^)
Dein Problem kannst du jedoch ziemlich simpel mit javascript lösen.
Dort machst dus folgendermaßen. Du berechnest die Höhe von Besucherbrowserfenster.
Ziehst hiervon dein Hauptdiv+footer ab. Sollte das Ergebnis größer als 0 sein, positionierst du den footer einfach mit top bzw. margin-top = hauptdivhöhe.
Sollte ein Browser Javascript nicht verarbeiten können, so wird einfach der div weiterhin so angezeigt, wies mom der Fall ist^^
nickname,
am Sonntag
den 13.11.2011
um 00:34:09
Hey,
also mit JS kann man das Problem so lösen wie du es beschrieben hast.
ABER: Wenn das untere DIV keinen echten Inhalt hat, sondern wenn es dir nur um die Hintergrundfarbe oder ähnliches geht, dann musst du nur den Hintergrund und den Footer "synchronisieren" also gleich aussehen lassen. Der User merkt dann davon nichts. Dann ist der Footer zwar nicht so hoch wie der Rest der Seite, sondern halt so groß wie nötig, aber das sieht man dann eben nicht.
Hoffe ich hab dich richtig verstanden.
Ahnungsloser,
am Donnerstag
den 17.11.2011
um 21:16:22
Hallo, danke für die Antworten!!
Ich habe die Lösung! (ohne Javascript :)
Nichname, ich weiß nicht ob du das gemeinst hast, aber hast mich auf jedenfall auf die idee gebracht.
Der Footer sollte ein 16*16 Bild (ja, es geht um Minecraft ;) sein, dass sich immer wiederhohlt. Ich habe das Bild dem body gegeben.
Dann habe ich um den Haupt div einen weiteren div gelegt, der selbstverständlich die selbe Höhe hat und die Fensterbreite ausfüllt. Ich habe ihn aus Faulheit wrapperx genannt.
So ist überall der Hintergrund vom Footer, der aber vom normalen überdeckt wird.
1
2
3
4
5
6
7
8 | <body>
<div id="wrapperx">
<div id="wrapper">
Lorem ipsum ...
</div>
</div>
<div id="footer">Copyright ...</div>
</body>
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | #body {
background-image: url(footer.jpg);
}
#wrapper {
width: 960px;
}
#wrapperx {
width: *;
background-image: url(normbg.jpg);
}
#footer {
width: *;
background-image: url(footer.jpg) ;
}
|
Habe die HTML & CSS grad zusammengeschrieben. Hoffe habe nichts vergessen.
Ist es verständlich? Falls es jemanden interessiert fragt einfach ;-)
Viele Grüße und Danke nochmal!
Ahnungsloser
Ninos Ego,
am Donnerstag
den 17.11.2011
um 21:27:29
eine Beispielseite eventuell :P
Also mich interessierts grad ziemlich, ob es wirklich via css geht, wenn man mit background-image arbeitet, da ich grad das Prinzip nicht ganz verstehe o.o
EDIT: denke habs verstanden, dank dem bg-image und repeat verschiebts den unteren Div weiter runter bis ganz nach unten, ohne eine Position bestimmen zu müssen? :D
EDIT2: habs grad getestet und wirklich klappen tuts aber nicht^^
Ahnungsloser,
am Donnerstag
den 17.11.2011
um 21:44:19
Nein. Möchte die Seite grade nicht hochladen. Wenn ich dran denk schreib ich den Link hierhin wenn die Seite online ist.
Hier wiedermal Paint :)
Body(Grau): Hintergrundbild des Footer
wrapperx: hat das eigentliche Hintergrundbild. [width:*]
wrapper: hat eine Feste breite, Hintergrund der sich etwas absetzt
Footer: Transparent, volle breite
Das Hintergrundbild vom Body wird ja eigentlich im ganzen Browserfenster angezeigt. Wird nur vom wrapperx - der das eigentliche Hintergrundbild beinhaltet - überdeckt. Da der die Höhe vom wrapper hat, habe ich auf Höhe vom wrapper immer das eigentliche Hintergrundbild.
jetzt verstanden? =D
EDIT: Bei mir klappts.
EDT2: hab grad gemerkt das es garnicht so toll aussieht :)
nickname,
am Freitag
den 18.11.2011
um 05:42:25
Hallo, danke für die Antworten!! Ich habe die Lösung! (ohne Javascript :)
Nichname, ich weiß nicht ob du das gemeinst hast, aber hast mich auf jedenfall auf die idee gebracht.
Jap genau das meinte ich.
viel spaß beim weiter arbeiten.
Ahnungsloser,
am Montag
den 02.01.2012
um 21:52:23
Hallo,
hier der Link für alle die's interessiert
Grüße,
Danke nochmal!