Beiträge von MrMurphy

  • Probleme mit responsivem Design

    Hallo,

    zunächst solltest du bei HTML das "Best Practice" berücksichtigen. Das benötigst du um überhaupt die Grundlagen für ein Responisve Design zu erstellen.

    So sollten zum Beispiel a-Elemente sich immer in geeigneten Containern wie p, h1 bis h6, li u.s.w. befinden.

    Weiterhin solltest du grundsätzlich auf "position: absolute" verzichten. Das beißt sich in der Regel mit Responsive Design.

    Zitat

    Ich habe den Code beim responsiven Teil für @media (max-width: 900px) und @media (max-width: 480px) geschrieben.

    Die Vorgehensweise ist falsch und führt genau zu den Problemen, mit denen du dich grade rumschlägst.

    Die Breakpunkte des Responsive Design hängen nicht von Bildschirm- oder Fenstergrößen, sondern vom Inhalt ab. Danach musst du sie also ausrichten. Sich von vornherein auf bestimmte Breiten wie 900px oder 480px festzulegen ist schlicht falsch. Sowas wird leider immer noch von Leuten verbreitet, die das Responsive Design nicht verstanden haben oder gar noch am Papierlayout festhängen.

    Gruss

    MrMurphy

  • Div wird nicht automatisch so lange wie Text div

    Hallo,

    freundlich gesagt hast du die Seite sehr individuell erstellt. Du hast viele bewährte Vorgehensweisen zur Erstellung von Webseiten schlicht ignoriert. Deshalb sind nachträgliche Korrekturen nur schwer durchzuführen. Zudem wird fast jede Korrektur neue Probleme schaffen.

    Als Denkanstoß:

    Das div#impress befindet sich innerhalb des div#text01. Das div#text01 hast du mit der CSS-Anweisung "position: absolute" aus dem Textfluß herausgenommen, wie es so schön heißt. Der Effekt ist, das das div#text01 keine Beziehung zu den umgebenden div mehr hat, also auch nicht zum div#wrapper. Das div#wrapper kann also nicht mehr auf die Größenänderungen des div#text01 und seines Inhalts reagieren.

    Du must also "position:absolute" beim div#text01 entfernen.

    Und so musst du immer weiter zurück suchen. div#text01 befindet sich zum Beispiel in einem div#background-plakat, dem eine feste Höhe zugewiesen wurde. Da die für den Inhalt von vom div#impress nicht ausreicht muss die auch entfernt werden.

    u.s.w.

    Gruss

    MrMurphy

  • Homepageproblem

    Hallo,

    ich denke auch das dir ohne Link zu der Seite (eventuelle bei einem Freeware-Provider wie bplaced.net) nicht zu helfen ist.

    Das fängt schon damit an, das deine Grafik offensichtlich nicht zu deinem Quelltext passt. So ist in deinem Quelltext links die schmale Spalte und rechts die breite. In der Grafik ist das genau anders rum. In dem Quelltext hat die obere Navi einen blauen Hintergrund, in der Grafik der footer.

    Außerdem hast du verschiedene Tippfehler / Rechtschreibfehler im Quelltext, z. B. background_color, abolsute.

    Das Grundproblem scheint zu sein, das du dich vor den HTML- / CSS-Grundlagen drücken willst. Du hast zum Beispiel ein float (#menu ul li), das nicht durch ein clear oder ein clearfix abgeschlossen ist. Sowas geht bei der Vererbung beim CSS gar nicht. Lösch einfach mal dieses float um die Auswirkungen zu testen.

    Außerdem sollte man heutzutage bei neuen Seiten HTML5 und CSS3 und deren Elementen und Möglichkeiten benutzen.

    Gruss

    MrMurphy

  • Zelenabstand beim Internet Explorer größer als mit anderen Brwosern! :)

    Hallo

    Zitat

    Die Website ist leider noch nicht online .

    Ja und? Wofür gibt es Freeware-Provider? Zum Beispiel bplaced.net:

    http://foreninfo.bplaced.net/seiten_fremdpr…tand_im_ie.html

    Das Problem ist, das du die Abstände mit geschützten Leerzeichen erstellt hast. Das mag bei Textverarbeitungen funktionieren, im Internet nicht, da die Browser über die Größe solcher Leerzeichen selbst entscheiden müssen.

    Allein wenn der Zoom-Faktor geändert wird ändert sich die Darstellung, daher wohl auch die geänderte Ansicht im gleichen Browser bei dir.

    Heißt für dich: Grundlagen lernen und die Seite komplett neu aufbauen. Eine Korrektur ist leider nicht möglich.

    Gruss

    MrMurphy

  • Html für alle Browser anpassen

    Hallo,

    irgendwie hast du von dem ganzen Themenkomplex vollkommen unrealistische Vorstellungen.

    Niemand lernt HTML, CSS, JQuery ... durch das Ändern / Anpassen einer Seite.

    Mit den Angaben aus dem head-Bereich kann dir wohl auch kaum jemand helfen. Außer dir zu raten das aktuelle HTML5 und CSS3 zu nutzen.

    Angaben wie

    Zitat

    alles ordentlich angezeigt wird, ... alles komplett verschoben

    sind abolut nichtssagend.

    Zudem hängt die Ansicht nicht nur vom Browser, sondern auch von der Fenstergröße oder dem Betriebssystem mit den vorhandenen Schriftarten ab.

    Wenn du konkrete Hilfe benötigst benötigen wir einen Link zu der Seite und eine konkrete Fehlerbeschreibung.

    Gruss

    MrMurphy

  • Weiße Ränder zwischen divs auf IOS-Geräten

    Hallo

    Zitat

    ich habe in keinem Forum eine Antwort gefunden, die mir bei der Beseitigung dieser unter einem Pixel großen weißen Linien hilft

    Im Hamburger Elbtunnel wird ein Geisterfahrer gemeldet. Reaktion eines Autofahrers: "Einer?`Hunderte."

    Merkst was? Du bist der Autofarer und merkst es nicht mal.

    Wie sollen wir dir helfen, wenn du uns die entscheidenen Informationen vorenthälst? Mit deinen Quellcodeschnipseln erhalten wir folgendes Ergebnis:

    http://foreninfo.bplaced.net/seiten_fremdpr…01_abstand.html

    Gruss

    MrMurphy

  • Flexbox hilfe

    Hallo

    Zitat

    Ich bin kein Profi in solchen Sachen wie HTML und CSS.

    Das bringt dir nichts - auch als Laie musst du dich an die Regeln und die "Best Practices" von HTML und CSS halten. Dein Quellcode hat damit aber leider so gut wie nichts zu tun.

    Zitat

    Das Problem ist, dass das bild zu sehen ist, obwohl die Flexbox dort endet.

    Das verstehe ich nicht.

    Die Browser sind so programmiert, das sie versuchen jede Information anzuzeigen, die im Quelltext angegeben wird. Wenn du ein Bild einfügst werden die versuchen es auch anzuzeigen. Auch wenn es über das umgebende Element hinausgeht.

    Ob das Bild angezeigt wird oder nicht hat mit Flexbox überhaupt nichts zu tun. Wenn Elemente nicht angezeigt werden sollen wird dafür üblicherweise die CSS-Anweisung "display: none;" benutzt. Das gilt auch für Laien.

    Meine Tips für dein Beispiel:

    • Alle DIVs rausschmeißen
    • Alle Klassen rausschmeißen
    • Alle br-Elemente rausschmeißen
    • Semantisch korrekt mit dem dl-Element arbeiten
    • Die Möglichkeiten von HTML5 und CSS nutzen (z. B. :nth-child)
    Zitat

    Aber wenn in der Spalte "Aufgabe" viel Text steht

    Ich sehe dort nicht viel Text sondern ein langes Wort. Das ist etwas ganz anderes.

    Zitat

    flex:2 100%;

    Weißt du überhaupt was du da tust? Das du damit flex-grow und flex-shrink bestimmst?

    Gruss

    MrMurphy

  • Bild relativ zu anderem Bild ausrichten

    Hallo

    erkläre mal bitte was du mit "auf der gleichen Höhe wie das Bild" meinst. Soll die Oberkante der beiden Bilder auf einer Linie sein, oder die Unterkante oder die horizontale Mitte?

    Und warum sollen es 50px sein? Um flexibel zu bleiben wären Prozent-Angaben sinnvoller.

    Am geeignetsten erscheint mir das Flexbox Modell.

    Gruss

    MrMurphy

  • Relativegrößen mit Nachfahren und Margin oder Position:absolute

    Hallo

    Zitat

    verlass ich mich zum jetzigen Zeitpunkt erstmal aufs buch.

    Wenn die Informationen zu deinem HTML / CSS aus dem Buch kommen solltest du es in die Tonne treten. Das ist einfach nur Schrott. So wirst du nie aktuelles HTML5 und CSS3 lernen weil deine Grundlagen schlicht grottenschlecht sind. Und das später umzulernen funktioniert in der Regel nicht.

    Zudem hast du ja noch das zusätzliche Problem, das du klassischer Designer bist. Deshalb musst du zusätzlich damit klarkommen, das du für Internetseiten 70% bis 80% deines Designerwissen nicht nutzen kannst, weil es mit HTML und CSS nichts zu tun hat.

    Ich hatte dir ja bereits in meinem ersten Beitrag geschrieben:

    Zitat

    Internetseiten mit HTML und CSS sind ein vollkommen anderes Medium als Word, pdf, Plakate, Poster, Flyer u.s.w.

    Du gehst jedoch bei Internetseiten genau so vor wie bei den klassischen Medien. Das funktioniert nicht.

    Gruss

    MrMurphy

  • Relativegrößen mit Nachfahren und Margin oder Position:absolute

    Hallo,

    deine Fragen lassen sich nicht beantworten, da konkrete Beispiele fehlen und sie falsch gestellt sind.

    Insgesamt bist du aber offensichtlich auf dem falschen Dampfer.

    Internetseiten mit HTML und CSS sind ein vollkommen anderes Medium als Word, pdf, Plakate, Poster, Flyer u.s.w. Du kommst aus deinen bisherigen Arbeiten mit festen Grenzen leider nicht raus. Das ist zum Beispiel an dieser Aussage

    Zitat

    aber für die gängisten auflösungen am PC sollte das normal passen

    gut zu erkennen. Die Realität ist, das im Internet über 50% der User mit Smartphones und Tablets unterwegs sind. Deine Wunschvorstellung nach einer mehr oder weniger festen Größe, von der du ausgehen kannst, ist somit unrealistisch.

    Wenn du HTML und CSS lernen willst musst du als erstes verinnerlichen, das es keine festen Fenstergrößen / Viewports gibt. Entsprechend müssen die Seiten von Anfang an flexibel gestaltet werden.

    Deshalb solltest du auch gleich ein entsprechendes Grundwissen mit aktuellem HTML5 und CSS3 lernen. Zwei Wochen sind da noch gar nichts.

    Deine "Vorbelastung" als Designer ist eher hinderlich, da du viel Wissen, was dir in Fleisch und Blut übergegangen ist, beim Erstellen von Internetseiten vergessen musst.

    Webdesign hat sehr wenig mit klassischem Design zu tun, das immer von festen Größen ausgeht, die gefüllt werden sollen. Zum Beispiel eine Buchseite, eine Visitenkarte, eine Zeitschriftenseite, ein Poster, eine Reklame an einer Litfaßsäule / Hauswand u.s.w.

    Deinen Fragen ist die Suche nach so einer Größe anzumerken, die es im Internet schlicht nicht gibt. Deshalb sind auch deine Fragen, so wie du sie gestellt hast, nicht zu beantworten. Die Antwort wäre immer falsch. Als Beispiel

    Zitat

    Ich mein die Prozenteinheit bezieht sich ja immer auf die größe des Elternelements...

    ist diese Vorgabe in deiner Frage schon mal falsch. Auch hängt der Bezug nicht von dieser

    Code
    .galerie div > img { width:50% }

    CSS-Angabe ab, sondern von anderen Faktoren. Also dem HTML-Quelltext und weiteren CSS-Angaben.

    Gruss

    MrMurphy