Beiträge von Sempervivum

Bei Flex ist der Zeilenumbruch standardmäßig ausgeschaltet. Du kannst ihn mit flex-wrap: wrap; einschalten.

Verstehe, ein ähnliches Problem hat man, wenn man wieder zur Startseite will.

Das kannst Du beheben, indem Du mit absoluten Pfadangaben relativ zum Basis-URI referenzierst, wie es bei SelfHtml genannt wird:

https://wiki.selfhtml.org/wiki/HTML/Tuto…I_referenzieren

Also dem Link ein / voranstellen:

<a href="/index.php">Startseite</a>

Zitat

Allerdings geht das ganze nicht mehr zurück wenn ich im Reiter „aktuelle Würfe“ bin.

Wie meinst Du das?

Zitat aus der Fehlermeldung auf https://www.puschelreich.de/puschels/kitten/index.php:

Zitat

http:// wrapper is disabled in the server configuration by allow_url_include=0

...
failed to open stream: no suitable wrapper could be found

Und im Manual von include steht:

Zitat

Wenn "include-URL-Wrapper" aktiviert sind (was sie in der Standard-Konfiguration sind), kann die einzubindende Datei mit einem URL (über HTTP oder ein anderes unterstütztes Protokoll - siehe Unterstützte Protokolle und Wrapper für eine Liste unterstützter Protokolle) anstall eines lokalen Pfades eingebunden werden.

Offenbar ist das auf deinem Server nicht der Fall. Verwende statt dessen relative Adressierung, d. h.

../../steuerungoben.php

Auch kein Problem, wenn Du durch eine geeignete Adressierung die Pfeilstruktur auf die erste Stufe beschränktst:

        #my-breadcrumbs>ul>li>a:after {
            content: "";
            border-top: 40px solid transparent;
            border-bottom: 40px solid transparent;
            border-left: 40px solid #4060A5;
            position: absolute;
            right: -40px;
            top: 0;
        }

        #my-breadcrumbs>ul>li>a:before {
            content: "";
            position: absolute;

            margin-top: -30px;
            border-width: 40px 0 40px 40px;
            border-style: solid;
            border-color: #4060A5 #4060A5 #4060A5 transparent;
            left: -40px;
        }

Zitat

Jetzt wäre es halt noch toll, wenn das Submenu untereinander angezeigt wird und überlappt und nicht alles verschiebt.

Das kannst Du erreichen, wenn Du das Submenu absolut positionierst. I. allg. etwas wovon man abrät, aber in diesem Fall und allgemein bei Aufklappmenüs ein gängiges und bewährtes Verfahren:

        li {
            position: relative;
            display: inline-block;
        }

        ul.submenu {
            position: absolute;
            z-index: 999;
            left: 0;
            top: 100%;
            display: flex;
            flex-direction: column;
        }

        li:hover ul.submenu li {
            margin-top: 0 !important;
        }

        li:hover ul.submenu {
            margin-top: 0 !important;
        }

Ich habe es nicht bis ins Detail ausgearbeitet. Z. B. bei der Überdeckung heben sich die Menüpunkte wegen der einheitlichen Farbe nicht ab, da ist noch Feinarbeit gefragt.

Mit Grid habe ich keine Erfahrung aber mit Flex ist es einfach:

https://jsfiddle.net/Sempervivum/h10nte9u/9/

Es geht auch mit weniger Containern:

https://jsfiddle.net/Sempervivum/h10nte9u/13/

Mit Margins und Flex kann man noch viel mehr machen:

https://stackoverflow.com/questions/3255…856609#33856609

Zitat

es liegt einfach daran das

halt kein Platz mehr vorhanden ist um alles zu zentrieren.

Das trifft zu, justify-content kann nur wirken, wenn freier Raum vorhanden ist.

Aber warum bist Du denn der Meinung, dass Du jetzt nicht mehr mit margin arbeiten kannst? Dieses funktioniert einwandfrei, um vertikalen Abstand zwischen den Bildern herzustellen:

        aside {
            background-color: #808000;
            width: 175px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        aside>img,
        aside>a {
            margin-top: 20px;
        }

(p-Element wurde entfernt).

So, dieses funktioniert bei mir:

    <input onchange="checkdir(this.value);">
    <script>
        function checkdir(pdir) {
            $.ajax({
                url: "checkdir.php",
                method: "post",
                data: { dir: pdir }
            }).done(function (output) {
                if (output == "true") console.log(pdir + " existiert");
                else console.log(pdir + " existiert nicht");
            });
        }
    </script>

checkdir.php:

<?php
if (isset($_POST['dir'])) {
    if (file_exists($_POST['dir'])) {
        echo "true";
    } else {
        echo "false";
    }
}
?>

Zitat

Zuerst mal, muss es nicht in Zeile 7 data: vdir heißen?

Da hast Du vollkommen recht, so wie es da steht, ist es Blödsinn. So sollte es richtig sein:

$.ajax({
        url: "checkdir.php",
        data: {dir: vdir}
    }).done(function(output) {

success und done sollten eigentlich gleichwertig sein. Ich werde mal ein vollständige Testseite machen ...

Das "resultiert wahrscheinlich immer in einem Fehler" muss ich korrigieren: Ich habe es jetzt nicht genau untersucht, aber ich erwarte dass sich der Aufruf eines Verzeichnisses mit Ajax genauso verhält wie der Aufruf im Browser: Ist das Verzeichnis für Directory-Browsing freigegeben, wird das HTML des Directory-Listings zurückgegeben, ist es gesperrt, führt es zu einem Fehler.

Was das done() betrifft: Diese Funktion wird aufgerufen, wenn der Ajax-Aufruf erfolgreich war und hat die Ausgabe des Skriptes als Parameter. Müsste dann so aussehen:

function check(txt){
    var vval = ($("#text").val());
    var vdir = './upload/' + vval + '/';
    console.log(vdir);
    $.ajax({
        url: "checkdir.php",
        dir: vdir
    }).done(function(output) {
        if (output =="true") {
            // das Verzeichnis existiert
            $('#frage').animate({"opacity": "1"}, 500);
            $('#background').animate({"opacity": ".70"}, 500);
            $('#background, #frage').css({"display": "block" , "margin": "1% auto"});
            console.log('exists code');
        } else {
            console.log('not exists code');
        } 
    });
}

Ungetestet.

Da gäbe es zwar das "order" bei Flex aber am einfachsten ist es, wenn Du einfach in deinem Editor den Textblock nach oben verschiebst.

Offenbar resultiert es immer in einem Fehler, wenn Du ein Verzeichnis als URL in einem Ajax-Aufruf angibst. Schreibe stattdessen ein Miniscript, das mit file_exists() prüft, ob das Verzeichnis existiert und gib eine entspr. Kennung z. B. "true"/"false" zurück, die kannst Du dann in done() auswerten kannst.

Darüber kannst Du dir mit phpinfo() Klarheit verschaffen. Einfach in der Ausgabe nach "xdebug" suchen.

Ich verstehe das so, dass die graue Navigation nach oben soll und weiter die ganze Zeile ausfüllen und dann darunter links die gelbe Navigation links und und der Container mit "Puschelreich - Maine Coon Zucht" rechts daneben? Dann verschiebe die graue Navigation #steuerungoben über die beiden anderen Blöcke. Lege einen Container um #steuerunglinks und section und ordne dann beide nebeneinander an.

Das ist nicht nur Erfahrung und ein geschultes Auge sondern die Entwicklerwerkzeuge des Browser sind da sehr hilfreich. Kann nur empfehlen, dich damit vertraut zu machen. Maus drüber, Rechtsklick - "Element untersuchen" und Du siehst sofort, was Sache ist.

html-seminar.de/woltlab/attachment/1855/

Der orangene Rahmen ist das Padding, das dich stört.

Ist ja cool, da habe ich wohl viel zu kompliziert gedacht.

Ja, ich benutze Visual Studio Code und mit der Erweiterung PHP Debug kann man PHP-Skripts debuggen. Setzt voraus, dass auf dem Webserver XDebug installiert ist.

Ich halte das mit dem Festlegen der Position für nicht ganz trivial: Die Schrift ist fast immer eine Proportionalschrift und dann ist es schwer, aus der Mausposition die Zeichenposition zu ermitteln. Ich würde mir statt dessen die Cursorposition im Text merken und dort das Smilie einfügen.