it-swarm.com.de

Seltsames Bootstrap Verhalten - Korrekte Anzeige auf einer Seite, nicht auf einer anderen

Ich habe den folgenden Code in einem Modul in der Fußzeile meiner Website platziert:

<div class="container-fluid">
<div class="row">
<div class="col-md-5 col-sm-5">
<p></p>
<a href="https://bestscottishcottages.co.uk/" target="_blank" rel="noopener"><img src="images/partner-logo-transparent.png" alt="partner logo transparent" width="175" height="145" style="display: block; margin-left: auto; margin-right: auto;" /></a>
<p></p>
</div>
<div class="col-md-7 col-sm-7">
<h3>Bill &amp; Sukie Barber</h3>
<p><span style="font-size: 14pt;"><a href="tel:+441450373424">{zen-phone}{/zen-phone}01450 373 424</a></span></p>
<p><span style="font-size: 14pt;"> <a href="mailto:[email protected]">{zen-envelope}{/zen-envelope}[email protected]</a></span></p>
<p><span style="font-size: 14pt;"> {zen-map-marker}{/zen-map-marker}Priestrig Croft,<br /> by Hawick<br /> TD9 7NT</span></p>
<div class="social">
<p><a href="https://www.facebook.com/Fiddle-Hill-Cottage-727153347486812/" target="_blank" rel="noopener">{zen-facebook-square}{/zen-facebook-square}</a><a href="https://www.instagram.com/fiddle_hill_cottage/" target="_blank" rel="noopener">{zen-instagram}{/zen-instagram}</a></p>
<p><a href="https://www.google.com/maps/dir/Current+Location/55.4408087,-2.8147109" target="_blank" rel="noopener" class="btn btn-green">Get directions</a></p>
</div>
</div>
</div>
</div>

Auf this Seite werden die Bild- und Adressinformationen auf einem iPhone 6/7/8 im Querformat korrekt nebeneinander angezeigt, auf this Seite werden sie jedoch übereinander angezeigt. Beide Seiten verwenden dasselbe Modul, um die Informationen anzuzeigen, verwenden jedoch eine andere Variante derselben Vorlage. Ich jedenfalls kann anscheinend nicht herausfinden, was den Unterschied verursacht. Könnte jemand bitte einen Rat geben?

Danke im Voraus. Donna

2
Dtorr1981

Auf der ersten Seite (Root) laden Sie Bootstrap 4 von MaxCDN. Auf der zweiten Seite (Verfügbarkeit) laden Sie eine lokale Version von Bootstrap 2 .

Sie laden auch nur die JS /media/jui/js/bootstrap.min.js auf der Verfügbarkeitsseite.

Versuchen Sie, Bootstrap 4 auf der Verfügbarkeitsseite einzufügen. Damit sollte das Problem behoben sein.

Außerdem würde ich das Laden der Bootstrap 2 JS-Datei auf der Root-Seite beenden. Sie benötigen nicht beide Versionen 2 und 4.

2
D. Morell