HTML Code wird auf falschen Stelle angezeigt
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
absoluter position
bekommen
bereich
bestimmtes ergebnis
bild
code
eigenschaft
eindeutig sagen
funktionieren
horizontalen abstand
http
image
index
kennen
originalen banner
position
richtigen stelle
schlagwort
sorgen
url
-
Hallo,
nun habe ich mich jetzt so weit durchgeschlagen aber das Logo wird leider nicht an der richtigen Stelle gezeigt.
Hier meine Seite.
http://igel99.lima-city.de/
und hier der HTML Code:
<div style="position:absolute; top:100px; left:500px;"> <img src="http://www.smb-goettingen.de/wp-content/uploads/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text">
Und dort habe ich das eingebaut in die "Graphene Tmeme".
[url][IMG]http://s14.directupload.net/images/140708/feyjxwn5.jpg[/IMG][/url]
Es soll ja weiter runter auf die Slidershow Bild und als feste Grafik dort bleiben in dem die Slidershow weiter so funktioniert.
Ich bin da kein Experte in HTML und versuche mich nur aus Bausteinen zusammen zu bauen.
Was fählt mir dort noch, was muss ich da noch ergänzen?
Ist es auch auf der richtigen Stelle, oder muss es woanders hin?
Leider habe ich nichts weiteres mehr gefunden in Graphene Theme.
Beitrag zuletzt geändert: 8.7.2014 12:03:30 von igel99 -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
1. Auf deiner angegebenen Seite finde ich den Code nicht
2. Man fügt keine Design-Elemente in den <head> - Bereich einer Webseite ein. (Wenn dann, bitte den <header> - Bereich nutzen oder ein <div> im <body> erstellen)
3. Das Bild ist falsch verlinkt. - http://s14.directupload.net/images/140708/feyjxwn5.jpg -
webfreclan schrieb:
1. Auf deiner angegebenen Seite finde ich den Code nicht
2. Man fügt keine Design-Elemente in den <head> - Bereich einer Webseite ein. (Wenn dann, bitte den <header> - Bereich nutzen oder ein <div> im <body> erstellen)
3. Das Bild ist falsch verlinkt. - http://s14.directupload.net/images/140708/feyjxwn5.jpg
Oh, und wie gehe ich da am besten jetzt vor mal für dumme erklärt?
Ich habe jetzt den Code noch etwas anders hin bekommen, aber leider ist das Logo dann unter den originalen banner versteckt.
Wie bekomme ich das vorstehend hin falls es so machbar ist?
<html> <head> </head> <body> <div style="position:absolute; top:100px; left:500px;"> <img src="http://www.smb-goettingen.de/wp-content/uploads/schiffLogoTransparent_150_mit_Weiss1.png" /> </div> </body> </html>
-
igel99 schrieb:
Ich habe jetzt den Code noch etwas anders hin bekommen, aber leider ist das Logo dann unter den originalen banner versteckt.
Wie bekomme ich das vorstehend hin falls es so machbar ist?
z-index ist da das Schlagwort - hier ein Artikel darüber: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index
Vielleicht wäre es aber einfacher ein anderes Theme zu nützen? -
webfreclan schrieb:
igel99 schrieb:
Ich habe jetzt den Code noch etwas anders hin bekommen, aber leider ist das Logo dann unter den originalen banner versteckt.
Wie bekomme ich das vorstehend hin falls es so machbar ist?
z-index ist da das Schlagwort - hier ein Artikel darüber: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index
Vielleicht wäre es aber einfacher ein anderes Theme zu nützen?
Ich danke dir ganz herzlich.
Es scheint jetzt so zu funktionieren wie ich es haben wollte.
Aber leider habe ich noch ein Problem festgestellt.
Es funktioniert nur wenn ich in Admin Bereich eingeloggt bin. Sobald ich mich auslogge, sieht man die Änderung leider nicht :(
Wie kommt den das?
<html> <head> <html><head><title>z-index</title> </head><body> <div style="position:absolute; top:83px; left:500px; z-index:12;"> <img src="http://www.smb-goettingen.de/wp-content/uploads/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text"> </div> </body> </html>
Und der Homepage Titel, der müsste dort noch verschoben werden und nach oben weiter.
Wie mache ich das am besten?
Beitrag zuletzt geändert: 8.7.2014 14:27:07 von igel99 -
Im Quellcode dieser Seite igel99.lima-city.de/?page_id=119 findet man tatsächlich deine Einfügung. Allerdings ist da sehr viel Code-Müll drin:
<html> <head> <html><head><title>z-index</title> </head><body> <div style="position:absolute; top:83px; left:500px; z-index:12;"> <img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text"> </div> </body> </html></head>
Alle Tags vom Typ body, html, head haben dort nichts zu suchen. Sie sind im Template schon an anderer Stelle enthalten und dürfen immer nur 1 mal vorkommen.
Im Zweifelsfall nach irgendwelchen Eigenschöpfungen Website zunächst, validieren. -
Ja ich kann leider keine Code schreiben, ich habe es nur durch lesen lesen, zusammengestellt aus Beispielen
Nun habe ich jetzt die beiden body Wörter raus. Ist es so jetzt besser?
<html> <head> <html><head><title>z-index</title> </head> <div style="position:absolute; top:83px; left:500px; z-index:12;"> <img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text"> </div> </html>
Aber jetzt habe ich immer noch ein Problem.
Wenn ich von andern PC oder Handy abrufe, dann stimmt leider die Position nicht von den Logo dort.
Was muss ich da noch ändern oder dazu fügen damit es auf allen Rechnern funktioniert?
Ich würde mich sehr freuen wenn mir jemand dabei hilft.
Danke im voraus. -
igel99 schrieb:
Ja ich kann leider keine Code schreiben,
Dann ist es an der Zeit, dieses zu lernen.
Wenn ich von andern PC oder Handy abrufe, dann stimmt leider die Position nicht von den Logo dort.
Wenn Du per absoluter Position einen horizontalen Abstand von 500px setzt, kann das auf einem Handydisplay, dessen gesamte Breite eventuell geringer ist, natürlich nicht funktionieren.
Wenn Du absolut positionierst UND auf verschiedenen Devices ein bestimmtes Ergebnis haben willst, wirst Du wohl per media-query oder auf anderem weg dafür sorgen müssen, das die Position deines Bildes auch paßt.
Ist es so jetzt besser?
Ob besser oder nicht, ist nicht relevant. Es ist noch immer falsch.
<html>
<head>
<html><head>
</head>
<div style="position:absolute; top:83px; left:500px; z-index:12;">
<img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text">
</div>
</html>
Mindestens die hervorgehobenen und gestrichenen Tags sind falsch. Ohne den vollständigen Seitencode zu kennen, läßt sich das beim Rest nicht eindeutig sagen.
-
fatfreddy schrieb:
igel99 schrieb:
Ja ich kann leider keine Code schreiben,
Dann ist es an der Zeit, dieses zu lernen.
Wenn ich von andern PC oder Handy abrufe, dann stimmt leider die Position nicht von den Logo dort.
Wenn Du per absoluter Position einen horizontalen Abstand von 500px setzt, kann das auf einem Handydisplay, dessen gesamte Breite eventuell geringer ist, natürlich nicht funktionieren.
Wenn Du absolut positionierst UND auf verschiedenen Devices ein bestimmtes Ergebnis haben willst, wirst Du wohl per media-query oder auf anderem weg dafür sorgen müssen, das die Position deines Bildes auch paßt.
Ist es so jetzt besser?
Ob besser oder nicht, ist nicht relevant. Es ist noch immer falsch.
<html>
<head>
<html><head>
</head>
<div style="position:absolute; top:83px; left:500px; z-index:12;">
<img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text">
</div>
</html>
Mindestens die hervorgehobenen und gestrichenen Tags sind falsch. Ohne den vollständigen Seitencode zu kennen, läßt sich das beim Rest nicht eindeutig sagen.
Ich habe jetzt das eine gelöscht aber ohne Änderung.
Nun habe ich noch was gefunden und ich habe an statt Pixel % gemacht. Somit ist etwas besser, aber immer noch nicht an der gleichen Stelle bei andere Auflösung, leider.
<html> <head> <title>z-index</title> </head> <div style="0 0 no-repeat; position:absolute; top:4%; left:25%; z-index:12;"> <img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text"> </div>
Wie kann ich dir den Seitencode geben, wo steht das genau?
@Nachtrag am 09.07.14
Ich habe den Code jetzt soweit bekommen, dass bei eine andere Auflösung die Position bleibt.
Aber ich kann über mein Handy das Logo nicht sehen. Wie kommt den das?
<html> <head> <title>z-index</title> </head> <div style="position:absolute; top:4%; left:50%; margin-left: -450px; z-index:12;"> <img src="http://igel99.lima-city.de/wp-content/uploads/2014/07/schiffLogoTransparent_150_mit_Weiss1.png" width="150" height="150" border="0" alt="text"> </div>
Was ist hier noch falsch, was muss hier noch geändert werden?
Beitrag zuletzt geändert: 9.7.2014 18:37:35 von igel99 -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
