Beiträge von Sempervivum

  • Ein paar flache Witze

    Zwei Ingenieurstudenten schlendern über den Campus. Da sagt der eine: „Woher hast du so ein tolles Fahrrad?“ Darauf der andere: „Als ich gestern ganz in Gedanken versunken spazieren ging, fuhr ein hübsches Mädchen mit diesem Fahrrad vorbei. Als sie mich sah, warf sie das Rad zur Seite, riss sich die Kleider vom Leib und schrie: 'Nimm dir was du willst!' Da habe ich das Fahrrad genommen“. Der erste Student nickte zustimmend: „Gute Wahl, die Kleider hätten vermutlich nicht gepasst!“

  • Bilder - Texte überschneiden sich

    PS: Wie ich sehe, hast Du begonnen, nicht nur die Nav sondern auch die Inhalte mit Bootstrap zu stylen. Da werfe ich erst Mal das Handtuch: Ich bin nie in Bootstrap eingestiegen und werde es auch nicht tun, weil es in der heutigen Zeit, wo es Flex und Grid gibt, für einfache Layoutzwecke überflüssig und überholt ist. Mit Flex und Grid lassen sich Layouts wesentlich einfacher und flexibler gestalten.

  • Bilder - Texte überschneiden sich

    In dem index-HTML ist der footer auskommentiert und wenn ich ihn aktiviere ist er unter den anderen Inhalten.

    BTW:

    • <body> kannst Du problemlos ohne ID sowohl in CSS als auch in Javascript ansprechen, eine ID ist hier überflüssig.
    • Ebenfalls überflüssig ist der Wrapper um den Footer.

  • Bilder - Texte überschneiden sich

    Zitat

    auf der ersten Seite zeigt er mir den footer einfach unter der navbar auch alls ich statt id --> class genommen habe.

    Wo möchtest Du ihn denn statt dessen angezeigt haben? Da von "footer" die Rede ist, wahrscheinlich ganz unten? Wie schon geschrieben, um dir da zu helfen, muss man das HTML und CSS sehen. Poste die fragliche URL.

  • Bilder - Texte überschneiden sich

    Zitat

    Ich habe meine Webseite auf einem Sever hochgeladen

    Wenn Du einen Server hast, hast Du ja schon Webspace und alles ist gut. Dann brauchst Du in Zukunft nur noch die URL zu posten.

    Zitat

    die Webseite sieht eig. gut aus, auch wenn ich das Fenster kleiner mache, es überschneidet sich nichts.

    Das ist ja schon ein wesentlicher Fortschritt gegenüber deiner Anfangsversion.

  • Bilder - Texte überschneiden sich

    Zitat

    Jetzt habe ich mein Logo in ein <div> getan, mit einer id=flex und habe dann im CSS display: flex; rieingeschrieben und

    flex-direction: row;. Ich denke es ist so gut oder ?

    Da ich ja schon angefangen habe, tue ich die einzelnden Objekte in Flex rein. Ist das möglich oder führt das zu Komplikationen ?

    Diese Fragen kann man nur beantworten, wenn man weiß, was Du dir für eine Anordnung vorstellst und wie dein letztes HTML und CSS aussieht. Es kann auch sinnvoll sein, wenn Du dir Webspace besorgst und das Ganze online stellst, dann kann man das HTML und CSS jederzeit einsehen und auch die Bilder sind verfügbar. Für den Anfang und zum Testen ist bplaced.net ganz brauchbar.

  • Bilder - Texte überschneiden sich

    Zitat

    Nun Gut ich hab das zusätzliche div eingefügt aber mein Visual Studio hat mir bei dem ersten </div>, das ausserhalb des Kommentars sein muss keinen Fehler angezeigt.

    Dann braucht es dafür wahrscheinlich eine Erweiterung. Selber habe ich HTMLHint installiert, versuche es damit.

    Zitat

    Auf den optischen ersten Blick sah nichts anders aus.

    Die Browser sind sehr tolerant gegenüber Fehlern im HTML. MrMurphy hat das hier in Posting #5 ausführlich erklärt:

    Wann werden obsolete Elemente/Atrribute/Dinge entfernt?

  • Bild mit Javascript unten abschneiden

    Das ist sowohl mit HTML und CSS als auch mit Javascript und Canvas machbar. Allerdings ist es in beiden Fällen für einen technisch Versierten kein Problem, an das vollständige Bild heran zu kommen. Es geht aber auch mit PHP, dann würde das beschnittene Bild gar nicht an den Browser gelangen und die verdeckten Informationen wären sicher gegen Ausspionieren.

  • Bilder - Texte überschneiden sich

    Zitat

    Das Problem mit Grids (besonders damit)und flexbox ist, dass ich mir da Videos angeguckt habe, die aber irgendwie nicht umsetzen konnte. Aber ich denke mit Flexbox wäre das einfacher als Grid oder ?

    Ich glaube nicht, dass das eine einfacher ist als das andere. Beide sind jedoch unterschiedlich und es kann die Sache erschweren, wenn man z. B. versucht, mit Grid ein Layout umzusetzen, für das sich Grid nicht eignet und umgekehrt mit Flex.

    Es ist sicher zu empfehlen, am Anfang kleine Brötchen zu backen und sich Layouts vorzunehmen, die nicht zu kompliziert sind.

    Hier bei HTML-Seminar gibt es auch eine Einführung in Flex:

    https://www.html-seminar.de/css-flexbox.htm

    nicht jedoch für Grid, wenn ich nicht etwas übersehe.

  • Bilder - Texte überschneiden sich

    So, ich habe mit dem neuen Code wieder eine Testdatei gemacht und dort ist zunächst mal aus meiner Sicht alles OK. Du schriebst:

    Zitat

    Ich habe auch ein Logo im Bild, das überschreibt trotzdem alles.

    Das passiert bei mir nicht. Sowohl im HTML als auch im CSS zeigt mein Editor mir jedoch diverse Fehler an. Es ist möglich, dass dadurch dein Browser den Text anders interpretiert als meiner (ich habe Opera).

    Im CSS fehlte eine schließende Klammer:

    Code
            .navbar {

            top: 0px;
            position: sticky;
            /* hier fehlte die schließende Klammer: */
        }

        /*about.html */
        #body2 {
        /* usw. */

    Und im HTML passte einiges mit den schließenden Divs nicht:

    Ein guter Editor erleichtert einem das Leben sehr, denn er rückt den Code automatisch ein, so dass man die Struktur besser erkennt und er zeigt Fehler an. Selber benutze ich Visual Studio Code.

  • Bilder - Texte überschneiden sich

    Zitat

    Ich habe auch ein Logo im Bild, das überschreibt trotzdem alles.

    Dann stimmt da noch etwas nicht. Poste das neue HTML und CSS.

    Zitat


    Muss ich mit Grid oder Flexbox zwingend arbeiten damit meine Seite sozusagen responsive ist ?

    Wie ich sehe, hast Du dich schon gut informiert. Einfache Layouts kann man auch ohne das realisieren, aber wenn es etwas komplizierter wird, geht es leichter mit Grid und Flex. Sieh es nicht als Belastung sondern als Techniken, die die Sache einfacher machen.

  • Bilder - Texte überschneiden sich

    Ich muss mich korrigieren: Bei sticky erscheint das Element zunächst dort, wo Du es im HTML notiert hast, d. h. unter den Videos. Erst beim Scrollen, wenn es nach oben wandert, bleibt es oben kleben. D. h. wenn Du die Nav von Anfang an oben haben willst, musst Du sie auch oben notieren.

  • Bilder - Texte überschneiden sich

    Dann erst Mal willkommen im Forum!

    Fangen wir mit dem Kernproblem an: Die Bilder, Videos und Texte überschneiden sich. Das liegt daran, dass Du ausgiebig von position: fixed; und position: absolute; Gebrauch gemacht hast. Dazu musstest Du die Positionen mit margin-top und top so anpassen, dass es bei einem breiten Browserfenster passt. Wird das Browserfenster jetzt schmaler, brechen die Text auf mehrere Zeilen um und weil die Positionen gleich bleiben kommt es zu den Überlagerungen. Ein häufiges Problem.

    Meine Empfehlung: Lass das position weg, dann werden die Elemente untereinander angeordnet, die Höhen passen sich an die Inhalte an und es gibt keine Überlagerungen.

    Bei dem Menü bzw. der Navigation ist es jedoch gängige Praxis, dass es fixiert ist und auch beim Scrollen immer sichtbar. Weiterer Vorschlag: Gib diesem ein position: sticky;, wie hier beschrieben:

    https://www.html-seminar.de/css-position-sticky.htm

    Es gibt sicher noch mehr zu deinem Layout anzumerken aber ich lasse es erst Mal hierbei bewenden.

  • Wann werden obsolete Elemente/Atrribute/Dinge entfernt?

    Zitat

    Weil es nicht um eine einzige Tabelle geht, sondern um etwa 200 verschiedene Tabellen. Und bei einigen wird border=1 benötigt und bei anderen nicht. So einfach automatisch geht das nicht.

    Verstehe, dann ist es natürlich nicht so einfach wie es den Anschein hatte. Ich habe inzwischen mal den Link in der scrollenden Tabelle aufgerufen - das scheint ja eine Software für die Generierung eines Stundenplans zu sein. Komplexe Sache wahrscheinlich.