Beiträge von Sailor

  • Tabelle mit Lücke

    Das grundlegende Problem mit deinem Layout, wenn es denn schon unbedingt eine Tabelle sein muss, sind die Bilder, die du benutzt.
    Standardmäßig (default) werden Bilder mit der 'vertical-align: baseline;' eingefügt. Daraus ergibt sich allerdings zum unteren Rand des Elementes ... hier deine td's... ein paar Pixel Abstand. Das ist das, was du siehst.
    Du müsstest deinen oberen beiden Eckenbildern ein 'vertical-align: bottom;' und den Hintergrundbildern in der oberen Zeile ein 'background-position: bottom;' geben, damit es (hingefummelt) passt.
    Aber ehrlich, das ist alles totaler Quatsch... das geht einfacher und besser!
    Du schreibst als Doctype <!DOCTYPE html>.. also willst du HTML5 benutzen. Das tust du aber durchgehend nicht... was ich da sehe gehört alles zu veralteten HTML Versionen.
    Diese ganze aufwendige Methode mit den Bildern am Rand kannst du dir sparen, wenn du einfach der Tabelle mit CSS einen Rand gibst...

    HTML
    table {
  width: 900px;
  margin: 0px auto;
  background-color: rgba(200, 200, 200, 0.8);
  border: 5px solid #a00;
  border-radius: 10px;
}


    Teste das mal und wenn das für dich ok ist, dann poste deinen neuen Code und wir schmeißen den Rest der veralteten Dinge noch raus!

  • Wie kann ich ein Element hübsch rechts floaten lassen

    Dann hast du das auch falsch verstanden.
    Du brauchst einen Flex-Container... <div class="container">
    und in diesem Container packst du deine Flex-Items <div class="a"> und <div class="b"> hinein.

    HTML
    <div class="container">
   <div class="a">....</div>
   <div class="b">....</div>
</div>


    Dann bekommt 'container' im CSS das 'display: flex:' und weitere Formatierungen gem dem Link, den ich gepostet habe.

    PS ... flex-direction: column; ist auf jeden Fall nicht das, was du willst... das setzt die Flex-Items untereinander!

  • Damals als es noch Framesets gab....

    Dann bleibt ja nur die Option für jedes Thema eine eine eigene Seite zu erstellen und dann mit dem Menü jeweils die entsprechende aufrufen...


    So sollte dann das Menü aussehen... und das Layout der Seiten, mit statischer Kopf- und Fußzeile sollte mit etwas CSS hinzubekommen sein.

  • Damals als es noch Framesets gab....

    Es sollen also nicht alle Inhalte auf nur einer Seite sein und dann durch Anklicken lediglich zu der entsprechenden Position gesprungen werden?
    Dann ist der Aufbau deiner Links nicht tauglich... mit href="#irendwas" bleibst du immer auf der selben Seite und springst lediglich an die Stelle, die mit id="irgendwas" gekennzeichnet ist... er springt als nicht auf eine (andere) Seite, sondern verändert nur die Position der Seite.
    Was aus deinem Eingangspost vielleicht ersichtlich ist, dass dir so was wie Frames vorschwebt.. nun ja... das war einmal! Sollte heute nicht mehr verwendet werden, auch wenn es noch funktioniert. Im Zeitalter von HTML 5 könnte man vielleicht einen IFrame verwenden und die Inhalte dann im IFrame anzeigen lassen, ohne die Seite zu verlassen.
    Oder, was vielleicht empfehlenswerter ist, einfach mehrere Seiten erstellen und dann mit dem Menü zwischen den Seiten wechseln.

  • Damals als es noch Framesets gab....

    Also aus deiner Beschreibung werde ich nicht so ganz schlau :(!
    Mit einer 'Linksammlung' meinst du ein Navigationsmenü?
    In der Form, wie du es gepostet hast, verlinkst du jeweils zu einer Sprungmarke, die sich auf der selben Seite befindet, wie dein Menü...


    Dann müsste deine Seite so aufgebaut sein und du würdest beim Anklicken eines der Links immer zu dem entsprechenden div springen.
    ... oder wie ist deine Frage zu verstehen?

    In deinem Code... ganz am Anfang muss das natürlich <li> heißen - und ganz am Ende </li>

  • height 100vh nur bis Browserfenster

    Die Höhe eines Elements wird vom Inhalt bestimmt... es sei denn, du hast was anderes vorgegeben wie zB

    height: calc(100vh - 100px);

    daran hält sich der Browser natürlich. Mach die Zwangsjacke weg und sag ihm, er soll die Höhe mindestens so hoch machen und sich ansonsten am Inhalt orientieren, dann sollte es klappen.

    min-height: calc(100vh - 100px);

  • Webdesign einmal anders

    Danke, dass du uns deinen Link hier präsentierst!
    Aber wenn ich draufklicke dann 10 Sekunden warten muss, bis alle die überflüssigen Scripte geladen sind und die Seite angezeigt wird... ich dann sehe, dass es eine Standard-WordPress Seite ist (dazu noch in XHTML), dann frage ich mich, was das mit der Threadüberschrift zu tun hat? ... und wo sind da die versprochenen interessanten Artikel?

  • Programmierung Startseite mit Divider?

    Darunter kann ich mir was vorstellen :)! Und in dieser einfachen Form ist das auch gar kein Problem - simples HTML mit etwas CSS und das Ganze dann etwas aufgehübscht.
    Allerdings solltest du die Entsprechenden Zutaten dazu haben... unter anderem ein passendes Hintergrundbild, Logo, ggf beschreibende Texte, eine Idee, wie das fertig Layout aussehen soll?

  • Programmierung Startseite mit Divider?

    Ja - du hast Recht ;)! Da war ich schon mal.
    Allerdings verstehe ich nicht so ganz, was du haben möchtest?
    Auf deiner Startseite läuft ein Slider... dieser Slider schaltet zwischen 3 Ansichten um... 1 und 2 Ansicht beinhaltet einen Link zum 'Shop now' Women Shop und in der 3. Ansicht kommt ein Link zum 'Shop now' Männershop.
    Wie soll das denn fertig aussehen?

  • CSS Probleme mit thumb Darstellung

    Zitat

    und zuweit unten. Kann ich sie irgendwie auf der oberen Kante zum Hauptbild fixieren?


    das könntest du erreichen, indem du im CSS bei dem äußeren Flex-Container statt 'align-items: center;' ... 'align-items: flex-start;' einfügst. Damit würden die beiden inneren Container bündig 'oben' anfangen. Das verhindert aber nicht, dass dann bei vielen Thumbs ggf der rechte Container nach unten über das Hautbild hinausragt.
    Dort einen Slider einbauen? Uhhh.. da würde ich von abraten, es sei denn, Shopify bietet sowas an... in so eine Seite etwas 'fremdes' einbauen führt meist zu Konflikten.
    Versuche mal dem zweiten Flex-Container.. also dem, in dem die Thumbs drin sind... zusätzlich im CSS ein 'overflow: auto;' ins CSS zu schreiben. ... hmm... ich fürchte aber, dass das nicht wirklich funktionieren wird, denn wenn dessen Höhe nicht irgendwie begrenzt ist, macht er sich selbst so hoch, wie er eben Inhalt hat - aber Versuch macht klug.
    Zur Darstellung auf dem Tablet kann ich so nichts sagen... aber versuche mal folgendes auf dem Desktop! Entweder schalte über die Webentwickler Tools den Modus 'Bildschirmgröße testen' ein oder verkleinere einfach das Browserfenster und schau mal, ob sich bei irgendeiner Breite an der Anzeige was ändert, was dann so aussieht, wie du es auf dem Tablet hast?