Problem mit Bildpositionierung

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
Eliquas
Posts: 137
Joined: Mon Dec 13, 2010 10:23 am

Re: Problem mit Bildpositionierung

Post by Eliquas » Mon Dec 14, 2020 12:16 pm

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?
You do not have the required permissions to view the files attached to this post.
CMSimple_XH 1.7.1

Advancedform 1.1
Fa 1.2
Filebrowser for CMSimple_XH 1.7.1
Hi_updatecheck 1.4
Jquery 1.6.4
Meta_tags for CMSimple_XH 1.7.1
Pagemanager 3.1
Page_params for CMSimple_XH 1.7.1
Tinymce4

PHP 5.6.32

Eliquas
Posts: 137
Joined: Mon Dec 13, 2010 10:23 am

Re: Problem mit Bildpositionierung

Post by Eliquas » Tue Dec 15, 2020 8:55 am

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)
CMSimple_XH 1.7.1

Advancedform 1.1
Fa 1.2
Filebrowser for CMSimple_XH 1.7.1
Hi_updatecheck 1.4
Jquery 1.6.4
Meta_tags for CMSimple_XH 1.7.1
Pagemanager 3.1
Page_params for CMSimple_XH 1.7.1
Tinymce4

PHP 5.6.32

lck
Posts: 2279
Joined: Wed Mar 23, 2011 11:43 am
Contact:

Re: Problem mit Bildpositionierung

Post by lck » Tue Dec 15, 2020 12:11 pm

Eliquas wrote:
Tue Dec 15, 2020 8:55 am
Hallo, ich habe es nun geschafft, die ersten zweiProbleme zu lösen: Der gelbe Hintergrund ist da, die Farbboxen auch.
Gut.
Eliquas wrote:
Tue Dec 15, 2020 8:55 am
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.
Eliquas wrote:
Tue Dec 15, 2020 8:55 am
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;
}
Eliquas wrote:
Tue Dec 15, 2020 8:55 am
und der Text in der rechten Box soll mittig stehen.
Sehe gerade, der ist ja schon mittig in der Box.
Eliquas wrote:
Tue Dec 15, 2020 8:55 am
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.
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“   👉 Ludwig's XH-Templates for MultiPage & OnePage

Eliquas
Posts: 137
Joined: Mon Dec 13, 2010 10:23 am

Re: Problem mit Bildpositionierung

Post by Eliquas » Tue Dec 15, 2020 1:53 pm

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.
CMSimple_XH 1.7.1

Advancedform 1.1
Fa 1.2
Filebrowser for CMSimple_XH 1.7.1
Hi_updatecheck 1.4
Jquery 1.6.4
Meta_tags for CMSimple_XH 1.7.1
Pagemanager 3.1
Page_params for CMSimple_XH 1.7.1
Tinymce4

PHP 5.6.32

Eliquas
Posts: 137
Joined: Mon Dec 13, 2010 10:23 am

Re: Problem mit Bildpositionierung

Post by Eliquas » Wed Dec 16, 2020 5:42 am

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?
CMSimple_XH 1.7.1

Advancedform 1.1
Fa 1.2
Filebrowser for CMSimple_XH 1.7.1
Hi_updatecheck 1.4
Jquery 1.6.4
Meta_tags for CMSimple_XH 1.7.1
Pagemanager 3.1
Page_params for CMSimple_XH 1.7.1
Tinymce4

PHP 5.6.32

Post Reply