Beiträge von Sailor

    121px wegen der Größe des Hintergrundbildes und dem benötigten Platz (Breite) der Linkbeschreibung (Text). Das kann man natürlich auch anders lösen, wenn man die Gesamtheit der im Nav verwendeten Elemente betrachtet und eben alles aufeinander abstimmt.

    Aber ab der Breite, bei der die Seite anfängt zu zicken, das linke Menü zu einem 'Hamburger' machen sollte einen Teil des Problems lösen oder auch nicht, denn so tief, um das zu durchschauen, bin ich nicht in den Code vorgedrungen.

    Das könnte mit folgendem Code gemacht werden... in deinem CSS die Klasse 'button' so formatieren:

    zusätzlich für die Liste:

    Code
    1. .pagenav ul {
    2. padding: 2px;
    3. margin: 0 auto;
    4. }

    Das ist aber nur die halbe Wahrheit - Dank deines etwas eigenwilligem Layout und des nicht vorhandenen responsive Layout, fliegt dir dann bei einer Viewport Breite kleiner ca. 800px der Rest der Seite um die Ohren.

    Dein CSS...

    Code
    1. div .mail:first-child {
    2. text-decoration: underline;
    3. background: #000066;
    4. }

    ist auf jeden Fall nicht richtig und ich sehe nicht, dass der bei dir, wie du sagst 'funktioniert auch toll'!

    Mit deinem Selektor sprichst du das erste Kindelement mit der Klasse 'mail' innerhalb eines Elternelementes <div> an ... das gibt es in deinem Code (so wie er oben steht) aber gar nicht.

    Wenn du etwas ansprechen willst, dann musst du auch dieses Element beim Namen nennen .. also 'a' (ggf mit der Klasse, wenn es denn eine hat).

    Und dieses Element befindet sich in dem div mit der Klasse 'mail' ... also 'div.mail' ... ohne Leerzeichen.

    Und da dein gewünschtes 'a' sowieso das einzige a-Element in diesem div ist, kannst du dir das :first-child sparen.

    Der Selektor wäre dann einfach...

    Code
    1. div.mail a
    2. oder auch einfach
    3. .mail a

    Das hat  basti1012 dir aber auch schon in #4 geschrieben.

    So wirklich verstehe ich nicht, was dein Problem ist - aber vergiss mal die Formatierungversuche mit dem <li>, sondern geh mal auf das <a> los....

    Ändere bitte mal in deinem CSS folgendes:

    1. Es muss color: #000066; heißen...font-colour: #000066; gibt es nicht.

    2. Es muss flex-wrap: wrap; heißen ...wrap: wrap; ist falsch.

    Wenn es dann nicht deinen Vorstellungen entspricht wieder melden.

    Das ist zumindest schon mal die halbe Miete... aber ohne den zugehörigen HTML (und ggf JavaScript) Code steht man auch nur davor, wie der Ochs vorm Berg. Man muss da immer Beides haben.

    Zum Einfügen von Code nutzt man hier im Forum die Einfügefunktion.. die verbirgt sich hinter dem Symbol </> oben in der Menüleiste des Editors (drittes Symbol von rechts).


    Und dein Anliegen hast du auch noch nicht wirklich beschrieben...

    und auch die Bildgalerie nicht so aussieht wie sie sollte

    ... tja... wie soll sie denn aussehen?

    Eine ZIP-Datei wird sich hier sicherlich niemand herunterladen.. und mit deiner Fehlerbeschreibung und den Screenshots kann wohl niemand irgendeine sinnvolle Hilfestellung geben. Poste einen Link zur Seite und alles wird gut :)!

    Aber die Sprungmarke funktioniert, landet nur leider nicht auf den Anfang des Artikels.

    Doch... genau da landet der Link... zwar etwas höher (bei dem Bild, wo auch sich auch die ID befindet) als von dir gewünscht, aber achte mal darauf, direkt nach dem Öffnen des Links ist die richtige Stelle gewählt - aber dann geht dieses Nachladen los und die Seite verschiebt sich wieder.

    Mit der von dir angegebenen Zielseite stimmt etwas nicht... da werden (unendlich) viele Daten nachgeladen. Schau mal beim Aufruf dieser Seite unten links im Browserfenster, was sich da alles noch tut... oder alternativ rufe mal die Webkonsole auf.

    Ich würde da mal den Seitenbetreiber kontaktieren, was da beabsichtigt ist. Sieht auf jeden Fall nicht richtig und gewollt aus.


    Dein Link zu der ID sollte dann so aussehen - aber wegen der oben beschrieben Problematik, kann es sein, dass das nicht richtig funktioniert.

    Code
    1. <a href="https://www.helpinganimalsromania.de/tiere/himmelskinder/himmelskinder-bis-2014#cc-m-textwithimage-6611227086" target="_blank">Link zum Anker</a>

    Du brauchst doch von der 'Fremdseite' nur den Quellcode ansehen (in deinem Browser). Im Code suchst du dann an der Stelle, an die du verlinken willst, nach einer passenden ID - diese ID in deinen Link eintragen und es sollte funktionieren.

    Lass mal den Slash ( / ) am Ende weg... direkt hinter den Seitennamen muss das #AnfangAbschnitt kommen.

    Und wenn die Endung nicht html ist, dann probiere doch mal htm ... oder php ... so viele Möglichkeiten gibt es da ja nicht.

    Und ein Anker auf der anderen Seite muss eine ID sein... suche mal nicht in Texten, sondern nach einer id="blabla" in einem HTML-Tag.

    zB <div id="blabla">...</div>.. dann ist blabla dein Anker.

    Bitte den Link zur Seite - oder den vollständigen Code HTML +CSS) - posten. Wie sollen wir sonst sehen, was du möglicherweise übersehen hast??

    Bei der Anzeige des Hintergrundbildes hast du nicht so viele Optionen - das wird über das Attribut background-size: .......; gesteuert.

    Da müsstest du auswählen, was dir am besten passt....

    https://www.w3schools.com/cssref/css3_pr_background-size.asp


    PHP? .... du meinst meine Signatur :)? Die hat mit der Antwort nichts zu tun, die steht unter allen meinen Beiträgen und ist 'nur' die PHP Übersetzung für 'wenn ich nicht einschlafen kann' (if(!sleep)) dann 'zähle ich Schafe' ({$sheep++}).

    Sorry, wenn ich dich damit verwirrt haben sollte - oder willst du in deine Seite noch PHP einbauen?

    Da scheinen mehrere Probleme vorzuliegen.

    Das Template, das du gefunden hast, ist grottenschlecht. Schreib dir lieber selbst etwas passendes.

    Warum?


    Es wird eine steinalte HTML Variante genutzt (XHTML). Solltest du auf HTML 5, das ist aktuelle Standard, umstellen.


    Im CSS sind 'veraltete' und unnötige Webkits angegeben. Alles Unnötige sollte man löschen.


    Im CSS sind Elemente formatiert, die es im Quellcode nicht gibt. -dito- löschen was unnötig ist.


    Im <head> fehlt die Angabe zum 'viewport'.

    Code
    1. <meta name=viewport content="width=device-width, initial-scale=1">

    Alleine das kann schon einen großen Unterschied machen, da hiermit Anzeigefehler bei mobilen Endgeräten vermieden werden.


    Aber nun zu den eigentlichen Fehlern!

    Du gibst einem Element (in deinem Fall dem <html> - es wäre besser <body> für diesen Zweck zu nutzen) ein Hintergrundbild, gibst dem Element aber keine Größe. Hintergrundbilder werden aber nur so groß dargestellt, wie eben das Elternelement vorgibt. Das bedeutet Elternelement 0 Höhe = Hintergrund 0 Höhe.

    Außerdem hat das Hintergrundbild einen ziemlich großen weißen, umlaufenden Rahmen. Der Rahmen wird also immer angezeigt und du wirst es nie flächendeckend als Hintergrundbild angezeigt bekommen.

    Versuche es mal hiermit:

    Das CSS:

    Das HTML:

    Allerdings ungetestet, sollte aber klappen.