Design verschiebt sich bei mehr Text

  • ich verstehe nur Bahnhof :D


    Also das mit der Grafik als div verstehe ich noch aber wo und wie trage ich das in das css rein ?

    Und was sind Nachfahrselektoren :) Ich bin ein Neuling und das wird auch nur eine private Seite

  • Das wird wesentlich einfacher, wenn Du keine Hintergrundgrafik verwendest, sondern einfach ein img-Tag:

    Code
    1. <div id="banner_right"><img src="banner_right_contact.jpg"></div>

    so auf contact.html und entspr. auf impressum.hml:

    Code
    1. <div id="banner_right"><img src="banner_right_impressum.jpg"></div>

    usw.


    #banner_right {


    float:left;


    width:219px;


    height:700px;


    background:url(banner_left.png) no-repeat;


    }


    das steht in meiner css

  • 1. HTML so ändern, wie ich geschrieben habe. Bildadressen durch deine eigenen ersetzen.


    2. CSS so ergänzen:

    D. h. das Bild wird nicht durch CSS sondern durch HTML eingebunden.

    Dieser Beitrag wurde bereits 1 Mal editiert, zuletzt von Sempervivum ()

  • Hier mal ein einfaches Beispiel. Allerdings basiert es noch auf Floats. Flexbox wär natürlich viel besser.

    Den Quelltext kannst du dir ja mal in Ruhe ansehen.

    schau mal das ist meine style.css also ich weiss nicht genau wo ich das rein geben muss....ich kenne mich mit css wenig aus da ich eher im designmodus arbeite. wobei ich diese css datei mit hilfe eines turoials gemacht habe


  • Also mir erschließt sich ja nicht wirklich, was es bringen soll, so etwas einfaches mit :before bzw. : after zu machen. Erschwert unnötig das Verständnis und die Lesbarkeit. Probiere lieber den Weg, den ich beschrieben habe, so ist es wesentlich einfacher.

  • Also mir erschließt sich ja nicht wirklich, was es bringen soll, so etwas einfaches mit :before bzw. : after zu machen. Erschwert unnötig das Verständnis und die Lesbarkeit. Probiere lieber den Weg, den ich beschrieben habe, so ist es wesentlich einfacher.

    Muss ich dann nicht für jede seite extra in der css etwas erstellen?

  • Nein, Du brauchst nur nur eine einheitliche CSS-Datei für alle Seiten. Das Bild wird ja im HTML eingebunden, wie ich oben geschrieben habe:

    Zitat

    Das wird wesentlich einfacher, wenn Du keine Hintergrundgrafik verwendest, sondern einfach ein img-Tag:

    Code

    1. <div id="banner_right"><img src="banner_right_contact.jpg"></div>

    so auf contact.html und entspr. auf impressum.hml:

    Code

    1. <div id="banner_right"><img src="banner_right_impressum.jpg"></div>

    usw.

  • Ich werde es jetzt mal Testen ob ich das hinbekomme :) Hatte die Tage leider keine Zeit. Das mit dem Verlauf der Hintergrundgrafik gefällt mir besser als eine einheitliche Farbe :)

  • Danke für den tollen Support. Für mich als Anfängerin ist das wirklich super. Schön das es so hilfsbereite Menschen gibt. Wenn du möchtest kann ich deine Webseite dann unter Partner auf unserer Verlinken ;)

  • Danke für das Angebot, aber meine eigene Webseite ist leider nicht mehr so gut vorzeigbar. Weil die Besucher fehlten, habe ich sie kaum noch gepflegt und meine Fotos lieber bei Facebook gepostet.

  • Grafiken, die NICHT zum Inhalt gehören, werden mit background-image eingebunden. Das IMG-Element ist hier sachlich falsch und auch nicht einfacher zu handhaben.

    Aber ist wohl egal.