Hallo Stephan,
ich habe mich mal der Sache angenommen und einen 4-spaltigen Footer im voller Breite gestaltet.
LINK - funktioniert allerdings in Flat Resp. nicht so richtig mit den %-angaben.
Aber man kann das natürlich auch mit Pixel-angaben umsetzen. Muss dann halt genau auf die jeweilige Seitenbreite angepasst werden.
Ich habe das mal umgesetzt und bin deinem Fall von einer Seitenbreite von 1500px ausgegangen?
LINK zu der Testseite
Einstellungen > CSS - die Werte eventuell anpassen
<style>
#afterfooter, #footer, #totop {
background-color: #3D3D3D;
color: #fff;
}
.testfoot {
margin: 0 auto;
float: left;
width: 1500px;
}
@media (max-width: 1500px) {
.testfoot {
width: 1125px;
}}
@media (max-width: 1125px) {
.testfoot {
width: 750px;
}}
@media (max-width: 750px) {
.testfoot {
width: 100%;
}}
.testfoot-spalte {
position: relative;
float: left;
margin: 10px;
width: 355px;
}
</style>
Alles anzeigen
Widget > Quelltext - im Footer der Startseite einfügen, anpassen und vererben
<div class="testfoot">
<div class="testfoot-spalte">
<h2>Bankverbindung</h2>
<p align="left">
Volksbank Kirchheim-Nürtingen<br>
IBAN: DE82 6129 0120 0007 9920 25<br>
BIC: GENODES1NUE
</p>
</div>
<div class="testfoot-spalte">
<h2>Externe Links</h2>
<p align="left">
<a href="https://www.zeta-producer.com/de/index.html" target="_blank">Zeta Producer</a><br>
<a href="https://community.zeta-producer.com/" target="_blank">Forum Zeta Producer</a><br>
<a href="https://blog.zeta-producer.com/" target="_blank">Blog Zeta Producer</a><br>
<a href="https://blog.zeta-producer.com/htaccess-zeta-producer/" target="_blank">.htaccess-Datei</a><br>
<a href="https://www.w3schools.com/css/default.asp" target="_blank">w3schools.com</a><br>
<a href="https://codepen.io/" target="_blank">Codepen</a><br>
</p>
</div>
<div class="testfoot-spalte">
<h2>Rechtliches</h2>
<p align="left">
<a href="datenschutzerklaerung.html">Datenschutzerklaerung</a><br>
<a href="impressum.html">Impressum</a><br>
</p>
</div>
<div class="testfoot-spalte">
<h2>Social Media</h2>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v2.8";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/probsteizella/" data-width="270" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false"><blockquote cite="https://www.facebook.com/probsteizella/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/probsteizella/">Probstei Zella</a></blockquote></div>
</div>
</div>
Alles anzeigen