php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 12-01-2008, 13:24
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard Problem mit CSS Layout

Moin Leute,

ich hab mal wieder ein kleines Problemchen, mit meinem CSS-Layout.

http://www.easy-schoolwork.de/Design3/Design.html

Da sollte der Footer eigentlich nur 81 Pixel hoch sein, und ganz unten angeklebt sein. Das sollte durch folgenden CSS Code erreicht werden:

PHP-Code:
.rahmen
 
{
  
width100%;
  
margin0px;
  
positionrelative;
  
min-height100%;
  
padding-bottom90px;

 }

*
html .rahmen
  
{
   
height100%;
  }

div.footer
  
{
    
backgroundurl(../gfx/gifjpg/footer_bg.jpg);
    
positionrelative;
    
margin-top: -81px;
  } 
Im Rahmen-Div ist dann der ganze Content, quasi alles außer dem Footer. Der Footer ist außerhalb des Rahmendivs. Der Footer hat eine top-margin von -81px, damit er genau seiner Höhe entsprechend in den Rahmen hereinragt. Der Rahmen hat eine Höhe von 100%, sodass er immer das volle Bild einnimmt und der Footer eben nur seine 81 px.

Ich hab ehrlich gesagt keine Ahnung wieso das hier nicht funktioniert. Bei einem anderen Projekt habe ich es exakt genauso gemacht und da hat es astrein geklappt. Ich hab 2 Stunden lang die beiden verglichen und nach Unterschieden gesucht, ich find aber einfach den verdammten Fehler nicht.

Danke schonmals für die Hilfe!
Mit Zitat antworten
  #2 (permalink)  
Alt 12-01-2008, 15:51
IchBinIch
 Registrierter Benutzer
Links : Onlinestatus : IchBinIch ist offline
Registriert seit: Apr 2003
Beiträge: 324
IchBinIch ist zur Zeit noch ein unbeschriebenes Blatt
Standard

mit den 100% ist ja eigentlich ein bekanntes Problem. Zeig mal die Seite auf der es funktioniert, so wie du es haben willst.
__________________
ICH BIN ICH!!!
Mit Zitat antworten
  #3 (permalink)  
Alt 12-01-2008, 19:40
mcmurphy
 PHP Junior
Links : Onlinestatus : mcmurphy ist offline
Registriert seit: Aug 2003
Ort: Berlin
Beiträge: 890
mcmurphy zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

html, body {height:100%;} ?

Ich würde es so machen:
body {position; relative; top:0px; left:0px;}
.footer {position:absolute; bottom:0px; left:0px; }
der Rahmen bräuchte dann noch padding-bottom:81px; damit der footer nicht den unteren Teil des Rahmen überdeckt.

habe ich jetzt nicht getestet, müsste aber klappen...
__________________
"I don't want to belong to any club that would accept me as a member."

Groucho Marx
Mit Zitat antworten
  #4 (permalink)  
Alt 13-01-2008, 11:27
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard

http://www.easy-schoolwork.de/Design2/Design.html

Dort funktioniert es so, wie es soll. Der Code ist aber 100% identisch mit dem obigen Problemfall, abgesehen von der Höhe des Footers. Der is hier nur 52 px glaube ich, bei dem anderen aber 81 px.


Was ich im Grunde erreichen will ist, dass der Footer immer ganz unten iist, und der Rahmen 100% der Höhe einnimmt. Wie es hier in dem funktionierenden Layout der Fall ist ( Der Footer ist übrigends auch dann immernoch ganz unten, wenn ich den Content-Div in der Mitte leermache ).

Ich versteh einfach nicht worin der Fehler liegt. :>

Ich werd mal das von McMurphy testen und dann schauen ob das damit funktioniert.
Mit Zitat antworten
  #5 (permalink)  
Alt 13-01-2008, 11:52
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Ah, danke Murph. Ich hab nun mal das "html, body {height:100%;}" dazugepackt. Nun schaut es wie folgt aus:

http://www.easy-schoolwork.de/Design3/Design.html

Problem ist aber immernoch, dass der Footer nicht mit im Bild ist. Das sollte doch eigentlich durch das "margin-top: -81px" gewährleistet sein. Woran liegt das nun noch, dass es nich mit im Bildchen ist ? :>
Mit Zitat antworten
  #6 (permalink)  
Alt 13-01-2008, 17:32
mcmurphy
 PHP Junior
Links : Onlinestatus : mcmurphy ist offline
Registriert seit: Aug 2003
Ort: Berlin
Beiträge: 890
mcmurphy zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

haste mal zum testen einen Blindtext eingesetzt?
Also das der Content die Seite ausfüllt.
Oder als gegenprobe nimm doch mal den text aus der anderen Seite raus (wenn du darauf zugriff hast)
__________________
"I don't want to belong to any club that would accept me as a member."

Groucho Marx
Mit Zitat antworten
  #7 (permalink)  
Alt 13-01-2008, 17:35
mcmurphy
 PHP Junior
Links : Onlinestatus : mcmurphy ist offline
Registriert seit: Aug 2003
Ort: Berlin
Beiträge: 890
mcmurphy zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Sehe gerade das die Seite ja jetzt funktioniert (bei FF 2)....
Woran lags?
__________________
"I don't want to belong to any club that would accept me as a member."

Groucho Marx
Mit Zitat antworten
  #8 (permalink)  
Alt 13-01-2008, 20:32
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Öhm, ja, ich hab zugriff auf die, bei der es funktioniert. Hab ich ja schließlich auch zusammengeschustert. Wenn ich den Text da rausnehme hat immernoch alles genau seine Richtigkeit.

Also bei mir funktionierts immernoch nicht, wie es soll. Der Footer ist jez zwar ganz unten, aber nichtmehr im Bild. Da nun alles zusammen ( body, rahmen ) eine Höhe von 100% hat müsste es logischerweise das ganze Bild ausfüllen - tut es auch. Leider zeigt aus irgendwelchen Gründen das "margin-top: -81 px;" bei dem div.footer keine Wirkung, denn aufgrund der negativen Margin müsste er ja dann 81 px ins Bild ragen, und nicht erst durch Scrollen zu sehen sein.

Im Grunde ist das kein Beinbruch, bloß ich kapier einfach nicht, warum das nicht geht. Bei dem anderen Beispiel funktioniert es ( Auch wenn ich den Text rausnehme ), da ich den Code ja von dort rüberkopiert habe, wozu etwas 2x machen, das man schonmal gemacht hat ? :>
Mit Zitat antworten
  #9 (permalink)  
Alt 14-01-2008, 08:30
dani_o
 PHP Senior
Links : Onlinestatus : dani_o ist offline
Registriert seit: Jun 2003
Ort: Lichtenstein/Sa.
Beiträge: 1.599
dani_o befindet sich auf einem aufstrebenden Ast
Standard

das habe ich mit einem kleinen trick mittels javascript gelöst.
ich haber per js die anzeigegröße des fensters ermittelt und
dementsprechend die layer mit pixelangaben positioniert ;-)
__________________
Signatur-Text ...

Geändert von dani_o (14-01-2008 um 09:07 Uhr)
Mit Zitat antworten
  #10 (permalink)  
Alt 14-01-2008, 17:55
arkos
 PHP Senior
Links : Onlinestatus : arkos ist offline
Registriert seit: Feb 2003
Ort: hamburg
Beiträge: 1.015
arkos ist zur Zeit noch ein unbeschriebenes Blatt
Standard

aber bevor du nun mit js anfängst, nimm dies (man hab ich heute zeit )

Code:
<html>
<head>
<style type="text/css">

body {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	height: 100%;
}
#wrapper {
	width: 100%;
	height: 100%;
	background-color: #cccccc;
}

#oben_eins {
	width: 100%;
	height: 40px;
	background-color: #eeeeee;
}
#oben_zwei {
	width: 100%;
	height: 40px;
	background-color: #999999;
}
#ganz_unten
{
	position: absolute;
	bottom: 0px;
	background-color: #cc0000;
	width: 100%;
	height: 81px; 
}

</style>
</head>
<body>

<div id="wrapper">


	<div id="oben_eins">
	</div>

	<div id="oben_zwei">
	</div>

	<div id="ganz_unten">
	hah, bin wohl 81px gro&szlig;
	</div>

</div>
	
</body>
</html>
__________________
**********
arkos
**********
Mit Zitat antworten
  #11 (permalink)  
Alt 14-01-2008, 19:54
mcmurphy
 PHP Junior
Links : Onlinestatus : mcmurphy ist offline
Registriert seit: Aug 2003
Ort: Berlin
Beiträge: 890
mcmurphy zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Machs wie arkos sagt - positioniere Footer auch immer mit position ...
@arkos
Aber braucht der wrapper dann nicht noch
position:relative; top:0px;
left:0px;
?
__________________
"I don't want to belong to any club that would accept me as a member."

Groucho Marx
Mit Zitat antworten
  #12 (permalink)  
Alt 15-01-2008, 11:37
arkos
 PHP Senior
Links : Onlinestatus : arkos ist offline
Registriert seit: Feb 2003
Ort: hamburg
Beiträge: 1.015
arkos ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Zitat:
Original geschrieben von mcmurphy

@arkos
Aber braucht der wrapper dann nicht noch
position:relative; top:0px;
left:0px;
?
hatte ich auch erst vermutete, da postion: absolute sich nur dann aufs eltern-element bezieht. aber wenn ich den letzten satz von selfhtml richtig verstehe, brauche ich es in dem falle nicht, da es ok ist, wenn sich mein footer statt aufm wrapper auf body bezieht:

Zitat:
selfhtml.de
Besonders das Verhalten der Angaben absolute und relative ist anfangs etwas verwirrend. Denn absolute verhält sich durchaus relativ, wie die inneren div-Elemente a4 bis a6 des Beispiels zeigen: relativ nämlich zum Rand des Elternelements (a3), vorausgesetzt dieses Element ist mit absolute, fixed oder relative positioniert. Falls kein von static abweichend positioniertes Vorfahrenelement existiert, bezieht sich die Positionierung auf das body-Element.


LINK SELFHTML
__________________
**********
arkos
**********
Mit Zitat antworten
  #13 (permalink)  
Alt 15-01-2008, 12:00
mcmurphy
 PHP Junior
Links : Onlinestatus : mcmurphy ist offline
Registriert seit: Aug 2003
Ort: Berlin
Beiträge: 890
mcmurphy zeigte ein beschämendes Verhalten in der Vergangenheit
Standard

Zitat:
footer statt aufm wrapper auf body bezieht
dann haste natürlich recht...
__________________
"I don't want to belong to any club that would accept me as a member."

Groucho Marx
Mit Zitat antworten
  #14 (permalink)  
Alt 15-01-2008, 19:07
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Sehr cool, vielen, vielen, vielen Dank! Ich hab zwar immernochkeine Ahnung, wieso meine Lösung nicht funktionieren wollte, aber das is mir jez auch wurscht, weil ich ja jez eine hab die funktioniert.

Danke vielmals, an alle, die probiert haben mir behilflich zu sein, insbesondere aber an arkos!
Mit Zitat antworten
  #15 (permalink)  
Alt 15-01-2008, 19:15
nohfreak
 Registrierter Benutzer
Links : Onlinestatus : nohfreak ist offline
Registriert seit: Nov 2007
Beiträge: 160
nohfreak ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Kommando zurück. Tut doch nich so wie es soll. Füll mal eins der oberen Divs mit mehr Inhalt, als ins Fensterchen reinpasst. :>

Geändert von nohfreak (15-01-2008 um 19:20 Uhr)
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

ADSMAN V3 - Werbe-Manager ansehen ADSMAN V3 - Werbe-Manager

ADSMAN V3 - mehr als nur ein Bannermanager! Banner, Textanzeigen und PagePeel Manager! Mit ADSMAN PRO haben Sie die Marketinglösung für eine effektive und effiziente Werbeschaltung mit messbaren Ergebnissen. Unterstützt werden Bannerformate in beliebi

25.10.2018 virtualsystem | Kategorie: PHP/ Bannerverwaltung
PHP News und Artikel Script V2

News schreiben, verwalten, veröffentlichen. Dies ist jetzt mit dem neuen PHP News & Artikel System von virtualsystem.de noch einfacher. Die integrierte Multi-User-Funktion und der WYSIWYG-Editor (MS-Office ähnliche Bedienung) ermöglichen...

25.10.2018 virtualsystem | Kategorie: PHP/ News
Top-Side Guestbook

Gästebuch auf Textbasis (kein MySQL nötig) mit Smilies, Ip Sperre (Zeit selbst einstellbar), Spamschutz, Captcha (Code-Eingabe), BB-Code, Hitcounter, Löschfunktion, Editierfunktion, Kommentarfunktion, Kürzung langer Wörter, Seiten- bzw. Blätterfunktion, V

22.10.2018 webmaster10 | Kategorie: PHP/ Gaestebuch
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 06:11 Uhr.