Hallo,
ich versuche mich daran, das Logo im Layout Producer responsive mittig darzustellen.
In der Desktopversion klappt es, wenn ich aber .navbar.brand.img im Bereich "responsive breakpoints" entsprechend anders definiere, wird trotzdem die Desktopeinstellung genutzt 
Jemand eine Idee?
Gruss Ronny
Ja, habe ich, HIER zu sehen.
Muss aber jetzt los. Ich schreibe heute Abend wie ich vorgegangen bin.
Ich führe hier mal 2 Möglichkeiten auf.
Auf meiner Seite zella.de bin ich so vorgegangen.
Eine transparente Grafik mit dem Format 1x1 Pixel erstellt. Diese Grafik als Logo eingefügt und eine Höhe von 96 Pixel angegeben. Somit ist Platz für das neue Logo geschaffen.
Nun habe ich das Logo per Positon Absolue eingefügt (Widget Quelltext im Content-Bereich).
<div style="position: absolute; top:40px; margin-left: -183px; left:50%; width:366px; height: 60px; z-index:7000;" class="image1"
><a href="http://www.zella.de" target="_self"><img title="zur Startseite" alt="" border="0" src="http://zella.de/bilder/366x60-einfach.png"></a></div>Auf dieser Testseite bin ich etwas anders vorgegangen.
Ist zwar ein anderes Layout, muss aber in Producer-Responsive genau so funktionieren.
Das Logo wurde abgeschaltet und im Banner-Bereich das Widget Quelltext eingefügt.
<div style="background-image: url('http://zella.de/bilder/hg-kopf.jpg');background-repeat: repeat; padding: 10px 10px 0 0px; position:absolute; color:#ffffff; top:0; left:0; width:100%; text-align: center; box-sizing: border-box;">
<p><img title="" class="logoo" border="0" alt="" src="http://zella.de/bilder/366x60-einfach.png"></p>
</div>
<div style="width: 1px; height:10px;"></div>
Der erste DIV fügt das Logo und den Hintergrund per Position Absolute ein. Der zweite schafft den Platz.
Weiterhin wurde per CSS eine Skallierung für die mobile Ansicht ab 620 Pixeln hinzu gefügt.
Einstellungen < CSS
@media (max-width: 620px) {
.logoo {
transform: translate(0, 16px) scale(0.8, 0.8);
}}Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!