Backstretch Hintergrundbild richtig positionieren

Allgemeine Fragen
scherenschlag
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 257
Registriert: Di 15. Dez 2020, 11:46
Wohnort: Dortmund

Backstretch Hintergrundbild richtig positionieren

Ungelesener Beitrag von scherenschlag »

Moin.
Ich stehe mal wieder im Wald. :confused:
Das Brinkhoffs Logo (unten rechts) soll sowohl auf dem Desktop PC,
als auch auf dem Smartphone eigentlich komplett zu sehen sein.
Auf dem Phone sieht es sogar noch besser aus als auf dem PC.
Ich glaube, ich habe schon alles mögliche ausprobiert was mir eingefallen sind.
Irgendwie habe ich mal wieder ein Brett vorm Kopp.
Kann mir jemand auf die Sprünge helfen?

https://www.tsad17.de/sonne2021
scherenschlag
MBR 5.9.17
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: Backstretch Hintergrundbild richtig positionieren

Ungelesener Beitrag von Werner-Zenk.de »

Je nach Breite des Fensters, wird das Hintergrundbild der "Biermarke" abgeschnitten.
Das Logo vielleicht an der linken Seite platzieren?
Was mir mehr Sorgen machen würde, sind die vielen Fehlermeldungen in der Browser-Konsole:

speisekarte.png
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Backstretch Hintergrundbild richtig positionieren

Ungelesener Beitrag von Tommy Herrmann »

Moin,

na ja - das kann doch so nicht funktionieren.

Du hast dieses Logo in Dein "Backstretch" Hintergrundbild direkt mit integriert. Der Hintergrund passt sich doch den unterschiedlichen Displaygrößen durch das Script an. An meinem Laptop (1600 x 900px) ist dieses Logo gar nicht zu sehen. Dein Original-Hintergrundbild ist übrigens viel zu hochauflösend mit 13MB (hier als .jpg) - das ist ein "no go" :eek:


hintergrund2021a.jpg


Ergo - das muss voneinander getrennt sein. Ein Hintergrund-Logo könnte man so positionieren:

https://www.w3schools.com/cssref/pr_bac ... sition.asp

... oder z.B. rechte Ecke unten dann so in den Bereich "Inside <head> code" der Seiteneinstellungen:

Code: Alles auswählen

<style>
    body { 
        background-image: url('logo-mobirise-250x250');
        background-size: auto 50px;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: 100% 100%; 
    }
</style>

... ob das überhaupt in Mobirise geht und welchen z-index das dann haben müsste, weiß ich nicht. Ob das im Zusammenhang mit "Backstretch" geht möchte ich mal bezweifeln.

... hier hatte ich das mal als Beispiel in NOF gezeigt (dort in der unteren linken Ecke):

http://www.tommyherrmanndesign.com/nof/ ... itioniert/
scherenschlag
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 257
Registriert: Di 15. Dez 2020, 11:46
Wohnort: Dortmund

Re: Backstretch Hintergrundbild richtig positionieren

Ungelesener Beitrag von scherenschlag »

Danke erstmal.
Das ist noch der Entwurf. Der wird noch überarbeitet und dann sind auch die Fehler weg. Hoffentlich. :D
Das Logo ist bereits von Seiten der Brauerei in den grauen Hintergrund integriert.
Da muss ich mal die Brauerei kontaktieren um Hintergrund und Logo getrennt zu bekommen.
Ich dachte ich bekomme das anders hin.
scherenschlag
MBR 5.9.17
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Backstretch Hintergrundbild richtig positionieren

Ungelesener Beitrag von Tommy Herrmann »

Nein - überlege doch mal - das kann doch gar nicht funktionieren.

Backstretch stellt den Hintergrund auf "cover" (bedecken) und dann muss das Logo deswegen vom Hintergrund getrennt sein, damit es überhaupt platziert werden kann.

Ich glaube aber eher, dass das mit den ganzen Bootstrap-CSS-Klassen von Mobirise nicht funktionieren wird.

Du könntest es eher fixiert als Vordergrundbild setzen - also ähnlich wie diese "Info Box":

https://www.mobirise-tutorials.com/Busi ... t-Box.html

Das ist aber meist am Handy eher schlecht, weil es einen Teil des Inhaltes überdeckt.
Antworten

Wer ist online?

Mitglieder in diesem Forum: Bing [Bot] und 20 Gäste