Problem mit Bildpositionierung

[Eliquas]

In der stylesheet.css unter .tpllck_nav {...}, Zeile 210 im Original CSS.

Habe dort versucht, die Farbe zu ändern. Hatte aber keine Auswirkung auf die Homepage.

Hm, ich sehe da keinen weißen Balken.

Hier ein Bildschirmfoto:

Foto_Balken.jpg

Um die entsprechenden Stellen zu finden, verwende die Entwickler-Tools des Browser. Am einfachsten geht das per Rechtsklick auf die betreffende Stelle und dann auf "Untersuchen" (in Chrome) oder "Element untersuchen" in Firefox. Dann siehst du unter "Elements" bzw. "Inspektor" den dazugehörigen Bereich und rechts die CSS-Styles und in welcher Zeile diese in der stylesheet.css festgelegt sind.

Das habe ich versucht. Klappt auch bei vielen Dingen. Wenn ich jedoch auf die Starseite(blaue Fläche) klicke erhalte ich nur die "box_mitte" oder in der unteren Seitenhälfte "box_rechts" angezeigt. Nicht die Hintergrundfarbe. Und es ist egal, wo ich klicke. Die Farbeinstellung erfahre ich nicht.

Soll die Startseite so aussehen wie hier, nur mit gelben Hintergrund? Und wie sollte die mobile Ansicht aussehen, können hier bestimmte Boxen wegfallen oder sollen auch hier alle sichtbar sein?
Wenn nicht, kannst du mir das mal grafisch etwas darstellen, dann versuche ich in den nächsten Tagen das Template dementsprechend für dich anzupassen.

Ja. Die Seite soll in etwa so aussehen, mit gelbem Hintergrund. Es wäre toll,wenn Du dir das noch mal anschauen könntest, weshalb hier die Boxen erscheinen und in der Homepage nicht.

Danke für Deine Unterstützung.

P.S.: Noch eine Frage. Gibt es eine einfache Möglichkeit, zu verhindern, dass das Logo auf dem Smartphone "abgeschnitten" wird. Ich denke, ich muss mehrere Bilder in unterschiedlichen Größen erstellen, oder? Was empfiehlst Du an Größen? Wenn ich im Netz suche, bekomme ich auf jeder Infoseite andere Werte. Und kann ich den Code, z.B.:

<img srcset="img/teaser_large.jpg 1920w,
img/teaser_medium.jpg 960w,
img/teaser_small.jpg 480w"
src="img/teaser_medium.jpg">

einfach im Template an Stelle des jetzigen einfügen, oder muss ich noch weitere Anpassungen vornehmen?

[Eliquas]

Hallo, ich habe es nun geschafft, die ersten zweiProbleme zu lösen: Der gelbe Hintergrund ist da, die Farbboxen auch.

Nur schieben sich jetzt, wennn ich den Bildschirm verkleinere, für Ansicht auf Tablet/Smartphone, alle Elemente übereinander. Irgend etwas stimmt mit dem Grid nicht.

Auch gellingt es mir nicht, die Texte in den Boxen anders zu formatieren. Die Zeilenabstände sollen geringer werden, die Titelzeile in der mittleren Box soll größer werden und der Text in der rechten Box soll mittig stehen.

Und es bleibt auch noch die Frage nach dem Logo für die responsive Website. (s. voriger Eintrag)

[lck]

Hallo, ich habe es nun geschafft, die ersten zweiProbleme zu lösen: Der gelbe Hintergrund ist da, die Farbboxen auch.

Gut.

Nur schieben sich jetzt, wennn ich den Bildschirm verkleinere, für Ansicht auf Tablet/Smartphone, alle Elemente übereinander. Irgend etwas stimmt mit dem Grid nicht.

Die Seite müsste wohl komplett neu aufgebaut werden, da ist schon zuviel geändert worden.

Auch gellingt es mir nicht, die Texte in den Boxen anders zu formatieren. Die Zeilenabstände sollen geringer werden, die Titelzeile in der mittleren Box soll größer werden ...

In der mittleren Box sind lauter h1 Überschriften und die haben ein line-height: 1.5, das müsste verändert werden aber nur für die mittlere Box, also:

Code: Select all

.mitte h1 {
    line-height: normal; /* oder 1 */
}

Code: Select all

.mitte h1:first-of-type {
    font-size: 2em;
}

und der Text in der rechten Box soll mittig stehen.

Sehe gerade, der ist ja schon mittig in der Box.

Und es bleibt auch noch die Frage nach dem Logo für die responsive Website. (s. voriger Eintrag)

Ich würde die Bilder und Logos als background-image in diesen Bereichen anlegen.

[Eliquas]

Das mit den Abständen hat jetzt geklappt.

Ich würde die Bilder und Logos als background-image in diesen Bereichen anlegen.

Aber was meinst Du damit. Daskenneich nicht.

[Eliquas]

Dass sich die Elemente der Startseite "übereinander schieben" liegt m.E. daran, dass die zwei Boxen irgendwie beim Verändern der Seitenbreite nicht richtig mit dem Grid mitwandern. Obwohl ich der Meinung bin, dass ich sie richtig eingefügt habe. Gibt es danoch irgend einen Befehl, den ich vergessen oder falsch eingetragen habe?

Wer weiß, wo ich noch etwas einstellen muss, damit es klappt?