Hallo,
ich schlage mich seit ein paar Stunden mit der Darstellung von responsiver Darstellung herum.
Soweit klappt ja alles...
Nur das der container sich der Höhe des Inhalts nich automatisch anpasst.
Als erstes der Link zur Webseite:
Was habe ich gemacht?
Als erstes eine user.css erstellt
Ein eigenes Modul erzeugt "So finden Sie uns"
Unter Erweitert CSS-Klasse Modul "maps" eingegen.
Modul-Tag "div"
Modulstil "card"
Im Content Modul folgenden Code
Code
<div class="responsive-iframe"><iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d1805.1695289917247!2d-57.5411916684393!3d-25.191785840186284!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sde!2spy!4v1669291248608!5m2!1sde!2spy" width="600" height="240" style="border: 0;" allowfullscreen="allowfullscreen" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe></div>
Im user.css folgenden Code
Code
.maps.card {
background: #FF9733;
color: #FFFFFF;
border: 2px;
}
.responsive-iframe {
max-width: 100%;
padding-top: 56.25%;
position: relative;
width: 100%;
}
.responsive-iframe iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: auto;
}
Alles anzeigen
Es wird auch alles gemacht im Frontend, nur der Container passt sich der Höhe des Inhalts nicht an (siehe Link)
Habe in Joomla und Browser den Cache geleert, aber es hilft nichts und komme nicht weiter.
Grüße aus Paraguay
Dirk