Supportnet / Forum / Webseiten/HTML
schrift unter include positionieren
Frage
Hallo zusammen
ich habe eine seite gemacht, in der der inhalt als include eingefügt wird.
unter dem inhalt kommt noch ein include() von dem footer.
der text im footer soll unter dem inhalt erscheinen (der inhalt hat eine variable länge) wenn ich jetzt in den footer einen text reinsetzte, dann erscheint der text ganz oben auf der seite.
wenn ich dann sage:
<div style="position:absolute; bottom:0px;">
Text
</div>
ist der text nur am unteren bildschirmrand, mitten im inhalt.
ich habe es auch schon mit position:fixed versucht, nur funktioniert das im ie nicht.
hier nochmal der link dazu:
http://finrod-c.drition.net/di/index.php
vielen dank schonmal
mfg
mirwald
Antwort 1 von DeluxeStyle
räum erst mal ein bisschen deinen Quellcode auf
was hat den der <h3> tag zu suchen? der macht gar nix.
außerdem das <p><hr></p> ist auch ned schön
dann versuch es mal mit position:relative
was hat den der <h3> tag zu suchen? der macht gar nix.
außerdem das <p><hr></p> ist auch ned schön
dann versuch es mal mit position:relative
Antwort 2 von mirwald
Hi
>was hat den der <h3> tag zu suchen? der macht gar nix.
die überschriften der news
außerdem das <p><hr></p> ist auch ned schön
> abstände...
und zu meinem problem?
danke schonmal.
mfg
mirwald
>was hat den der <h3> tag zu suchen? der macht gar nix.
die überschriften der news
außerdem das <p><hr></p> ist auch ned schön
> abstände...
und zu meinem problem?
danke schonmal.
mfg
mirwald
Antwort 3 von xmirwald
was vergessen:
position:relative
.. funktioniert auch nicht. da wird das bild ganz oben im ie angezeigt.
mfg
mirwald
position:relative
.. funktioniert auch nicht. da wird das bild ganz oben im ie angezeigt.
mfg
mirwald
Antwort 4 von rfb
nimm mal sämtlich Position-Angaben raus -> dann stimmt schon mal die Reihenfolge!
Wenn die Elemente einen Abstand nach links brauchen genügt ein margin oder eine Breitenangabe zusammen mit einer float-Angabe wenn mehrere nebeneinander stehen sollen.
Allerdings ist dein Quellcode ziemlich kaputt! Häufugster Fehler: auf <tr> muss <td> folgen, bei dir folgt da alles mögliche aber <td> niemals. Und wie die Browser das dann anzeigen lässt sich eh nicht so recht vorhersagen.
Also beseitige bitte die Fehler und komplettiere die Doctype-Declaration, damit die Browser deine Seite nicht im Quirksmodus anzeigen, denn auch das erzeugt Anzeigefehler.
Wenn die Elemente einen Abstand nach links brauchen genügt ein margin oder eine Breitenangabe zusammen mit einer float-Angabe wenn mehrere nebeneinander stehen sollen.
Allerdings ist dein Quellcode ziemlich kaputt! Häufugster Fehler: auf <tr> muss <td> folgen, bei dir folgt da alles mögliche aber <td> niemals. Und wie die Browser das dann anzeigen lässt sich eh nicht so recht vorhersagen.
Also beseitige bitte die Fehler und komplettiere die Doctype-Declaration, damit die Browser deine Seite nicht im Quirksmodus anzeigen, denn auch das erzeugt Anzeigefehler.
Antwort 5 von mirwald
@ rfb: danke schonmal. hab mal alles gemacht.
danke. und jetzt?
mfg
mirwald
danke. und jetzt?
mfg
mirwald
Antwort 6 von rfb
Also ein paar Fehler gibts noch:
Deine Seite im W3C-Validator
und
Deine Seite im W3C-Validator
und
Zitat:
nimm mal sämtlich Position-Angaben raus
hast du ignoriert!nimm mal sämtlich Position-Angaben raus
Antwort 7 von mirwald
Zu den postition angaben: achso, ich dachte du meinst nur position: realtive usw.. und nicht top:....
ok,
W3C-Validator > ja da stimmt noch nicht alles (warum er <p> nicht mag wunder ich mich) aber man wird doch jetzt schon dennoch die bilder so anordnen können wie oben beschrieben.
mfg
mirwald
ok,
W3C-Validator > ja da stimmt noch nicht alles (warum er <p> nicht mag wunder ich mich) aber man wird doch jetzt schon dennoch die bilder so anordnen können wie oben beschrieben.
mfg
mirwald
Antwort 8 von rfb
Zitat:
Zu den postition angaben:
genau genommen meinte ich allen Inhalt aller style-Attribute!Zu den postition angaben:
Bevor du nicht alle Fehler beseitigt hast lässt sich nur wenig vorhersehen.
Welche Elemente innerhalb welchen anderen vorkommen dürfen erfährst du bei SelfHTML
Ich würde dir raten dich erst einmal mit CSS vertrauter zu machen bevor du mit der position-Keule anfängst zu schwingen. Wie du bereits gesehen hast ist es relativ schwer, deren Ergebnis vorherzusagen, denn dazu brauchst du Kenntnisse im Aufbau von HTML-Dokumenten, insbesondere von Vor- und Nachfahren-Elementen im Dokumenten-Fluss sowie dem Herausnehmen von Elementen daraus.
Antwort 9 von mirwald
wenn jemand lust hat kann er es ja verbessern...
aber dennoch hat das jetzt nichts mit meiner frage zu tun.
ich kann mit den fehlern leben, solange alles in ff, ie, opera gut angezeigt wird.
ich vermute langsam, dass es für mein problem keine lösung gibt...
danke trozdem an alle!
mfg
mirwald
aber dennoch hat das jetzt nichts mit meiner frage zu tun.
ich kann mit den fehlern leben, solange alles in ff, ie, opera gut angezeigt wird.
ich vermute langsam, dass es für mein problem keine lösung gibt...
danke trozdem an alle!
mfg
mirwald
Antwort 10 von rfb
Zitat:
aber dennoch hat das jetzt nichts mit meiner frage zu tun.
das ist einfach falsch! Falsches HTML hat immer Auswirkungen auf die Interpretation des CSS.aber dennoch hat das jetzt nichts mit meiner frage zu tun.
Zitat:
ich vermute langsam, dass es für mein problem keine lösung gibt.
wer lesen kann ist klar im Vorteil: Antwort 4 erster Absatz ist die Lösung für dein Problem!ich vermute langsam, dass es für mein problem keine lösung gibt.
Dein Problem entsteht nur dadurch, dass du ohne Kenntnis der Hintergründe und vor allem ohne Notwendigkeit mit einem mächtigen Instrument wie der
position
-Eigenschaft rumhantierst wenn was simples wie float
, with
und margin
absolut ausreichen.Antwort 11 von Flupo
Wenn du die Positionsangaben rausnimmst, rutscht der Text, wie gewünscht, nach unten.
Somit haben die Antworten doch was mit der Frage zu tun.
Btw: Schriftgröße 5pt ist nicht wirklich lesbar.
Gruß Flupo
Somit haben die Antworten doch was mit der Frage zu tun.
Btw: Schriftgröße 5pt ist nicht wirklich lesbar.
Gruß Flupo
Antwort 12 von mirwald
hm, das hatte ich aber alles schonmal drin.
z.b.: beim menü: style="float:left; margin:0px.... dann war das menü nicht ganz links und nicht ganz oben an dem header...
und 2. habe ich ja noch das problem mit dem bild (was im mom noch eine schrift ist), dass ganz unten links am ende des includes stehen soll... weswegen ich eigentlich den thread aufgemacht hatte.
vielen dank
mfg
mirwald
z.b.: beim menü: style="float:left; margin:0px.... dann war das menü nicht ganz links und nicht ganz oben an dem header...
und 2. habe ich ja noch das problem mit dem bild (was im mom noch eine schrift ist), dass ganz unten links am ende des includes stehen soll... weswegen ich eigentlich den thread aufgemacht hatte.
vielen dank
mfg
mirwald
Antwort 13 von rfb
Zitat:
dann war das menü nicht ganz links und nicht ganz oben an dem header
dann arbeite daran. Offensichtlich sind dann die Werte für dann war das menü nicht ganz links und nicht ganz oben an dem header
margin
und padding
der betroffenen Elemente bzw. ihrer Vorfahren nicht identisch. Am einfachsten einmal zu Beginn der CSS-Datei ein* {padding:0;margin:0;}
einfügen damit die browserspezifischen Voreinstellungen genullt werden.
Zitat:
problem mit dem bild
das löst sich allein, wenn du es nicht positionierst sondern einfach so belässt und evtl. mit einer problem mit dem bild
clear
-Eigenschaft versiehst, so dass jegliches floating davor beendet ist.Antwort 14 von mirwald
In Ordung.
http://finrod-c.drition.net/di/
hab das jetzt einmal geändert.
1.habe zwischen dem header und dem menü ein <br> eingebaut. ich vermute mal, dass sollte ich anders lösen, weil zwischen den beiden bildern noch ein spalt ist.
2. wie kann ich jetzt den Text "news.. überschrift" usw.. nach rechts und etwas weiter oben verschieben, ohne dass der kl. text der ganz unten bleiben soll sich verschiebt?
rechtherzlichen dank zwischendurch mal für eurer durchhaltevermögen ;)
mfg
mirwald
http://finrod-c.drition.net/di/
hab das jetzt einmal geändert.
1.habe zwischen dem header und dem menü ein <br> eingebaut. ich vermute mal, dass sollte ich anders lösen, weil zwischen den beiden bildern noch ein spalt ist.
2. wie kann ich jetzt den Text "news.. überschrift" usw.. nach rechts und etwas weiter oben verschieben, ohne dass der kl. text der ganz unten bleiben soll sich verschiebt?
rechtherzlichen dank zwischendurch mal für eurer durchhaltevermögen ;)
mfg
mirwald
Antwort 15 von rfb
zu 2:
indem du dem Element, in dem sich der Text befindet einen entsprechenden linken Außenabstand (margin-left) gibst verschiebst du alles nach rechts.
zu 1 und 2:
ich vermute Beratungsresistenz! Auf die CSS-Eigenschaft float hatte ich doch schon ein paar mal hingewiesen.
indem du dem Element, in dem sich der Text befindet einen entsprechenden linken Außenabstand (margin-left) gibst verschiebst du alles nach rechts.
zu 1 und 2:
ich vermute Beratungsresistenz! Auf die CSS-Eigenschaft float hatte ich doch schon ein paar mal hingewiesen.
Antwort 16 von mirwald
so, ich hoffe so seid ihr mit mir zufrieden...
(mal abgesehen von der <td> / <p> reihenfolge usw. was ich noch ändern werde) sieht jetzt auch ganz gut aus.
nur noch was ganz kleines: das bild unten links (das ende der farbläufe) ist nicht ganz am boden.
wie kann ich dass noch korrigieren, ohne die keule zu benutzen?
vielen dank schonmal
mfg
mirwald
(mal abgesehen von der <td> / <p> reihenfolge usw. was ich noch ändern werde) sieht jetzt auch ganz gut aus.
nur noch was ganz kleines: das bild unten links (das ende der farbläufe) ist nicht ganz am boden.
wie kann ich dass noch korrigieren, ohne die keule zu benutzen?
vielen dank schonmal
mfg
mirwald
Antwort 17 von xmirwald
ps: habe ich leider jetzt erst gesehen: zwischen dem menü und dem header im ie 6.0 ist eine kl. lücke. habe schon versucht "padding:0;margin:0;" nochmal hinter style=" an die objekte ranzufügen, falls der ie mit *{} nicht klar kommt.
mfg
mirwald
mfg
mirwald
Antwort 18 von mirwald
Hallo.
habe soeben einen weiteren tread eröffnet weil dieser nichtmehr beachtet wurde... wie von den admins geheissen schreibe ich halt hier nochmal....
mein problem: ich habe immernoch von dem bild unten links einen kleinen abstand zum unteren bildrand.
wie bekomme ich diesen weg?
vielen dank schonmal
mfg
mirwald
habe soeben einen weiteren tread eröffnet weil dieser nichtmehr beachtet wurde... wie von den admins geheissen schreibe ich halt hier nochmal....
mein problem: ich habe immernoch von dem bild unten links einen kleinen abstand zum unteren bildrand.
wie bekomme ich diesen weg?
vielen dank schonmal
mfg
mirwald
Antwort 19 von rfb
entferne den Zeilenumbruch hinter dem Bild und hinter dem schließenden DIV, schau nochmal, welche Werte für margin und padding bei beiden gelten.
Antwort 20 von mirwald
HI
äh, ich sehe keine zeilenumbruch bei mir (<br> meinst du oder?)
margin und padding: beides im style.css auf 0 gesetzt.
danke, mfg
mirwald
äh, ich sehe keine zeilenumbruch bei mir (<br> meinst du oder?)
margin und padding: beides im style.css auf 0 gesetzt.
danke, mfg
mirwald
Antwort 21 von rfb
Zitat:
<br> meinst du oder?
nein, ich meine die Zeilenumbrüche im Quellcode<br> meinst du oder?
Antwort 22 von xmirwald
hallo? gibt es keine möglichkeit das bild ganz unten zu positionieren?
und im internet explorer ist noch ein kl. lücke zwischen dem header und menü, obwohl da margin und padding auf 0 sind...
danke..
mfg
mirwald
und im internet explorer ist noch ein kl. lücke zwischen dem header und menü, obwohl da margin und padding auf 0 sind...
danke..
mfg
mirwald
Antwort 23 von xmirwald
Hi
gibt es keine möglichkeit, das bild noch ganz nach unten zu possitionieren?
und: im internet explorer ist immernoch der abstand zwischen dem header und dem menü... wie bekomme ich den raus?
vielen dank schonmal
mfg
mirwald
gibt es keine möglichkeit, das bild noch ganz nach unten zu possitionieren?
und: im internet explorer ist immernoch der abstand zwischen dem header und dem menü... wie bekomme ich den raus?
vielen dank schonmal
mfg
mirwald
Antwort 24 von mirwald
sry, wegen dem dopplepost.. habe nicht gesehen dass es eine 2.seite gibt. und deswegen auch deinen beitrag nicht gelesen, sry!
also: umbrüche sind raus: im ie sind keine abstände mehr, aber wenn der text zu kurz ist, rutscht das bild unten links wieder weiter nach oben...
das passiert zwar im opera nicht, aber da ist noch der abstand zwischen dem bild und den bildschirmrand nach unten..
es wird ja langsam.. vielen dank.
mfg
mirwald
also: umbrüche sind raus: im ie sind keine abstände mehr, aber wenn der text zu kurz ist, rutscht das bild unten links wieder weiter nach oben...
das passiert zwar im opera nicht, aber da ist noch der abstand zwischen dem bild und den bildschirmrand nach unten..
es wird ja langsam.. vielen dank.
mfg
mirwald
Antwort 25 von Flupo
Probier mal hiermit.
Ich hab selbst noch keine Erfahrungen damit gesammelt, weiß dementsprechend nicht, ob das mit allen wichtigen Browsern vernünftige Ergebnisse liefert.
Gruß Flupo.
Ich hab selbst noch keine Erfahrungen damit gesammelt, weiß dementsprechend nicht, ob das mit allen wichtigen Browsern vernünftige Ergebnisse liefert.
Gruß Flupo.
Antwort 26 von mirwald
@flupo: danke habe ich ausprobiert, hat nur leider nichts genützt...
mfg
mirwald
mfg
mirwald
Antwort 27 von mirwald
Mit dem bild unten hab ichs jetzt aufgegeben, aber ich stell gerade fest, dass bei firefox 1.5 das menü und der header nen abstand zum linken seitenrand und nach oben haben.
wo kommt der plötzlich her?
http://manwe14.ma.funpic.de/di/index.php
mfg
mirwald
wo kommt der plötzlich her?
http://manwe14.ma.funpic.de/di/index.php
mfg
mirwald