Ich versuche, eine benutzerdefinierte Zeile zu erstellen, die 8 Logos in geraden Spalten am unteren Rand einer Seite hat, wenn sie auf dem Desktop in voller Größe sitzt (lg) Ich brauche sie, um in Antwort zu arbeiten.
Ich habe ein paar Optionen ausprobiert - 2 Spalten mit 4 Spalten verschachtelt und 4 Spalten mit 2 Spalten verschachtelt ... das Problem, das ich habe, ist die Rinne schafft zusätzlichen Abstand zwischen den Spalten, was bedeutet, dass die Logos nicht gleichmäßig Platz. Irgendwelche Experten haben eine bessere Idee, wie ich 8 Logos gleichmäßig in einer Reihe platzieren könnte? vielleicht ein neues 8 col benutzerdefiniertes Gitter erstellen?
Jede Hilfe wäre großartig.
Danke N
Bootstrap 3
Wie wäre es mit einem list-inline
mit 4 Spalten von 2 wie folgt ..
Demo: Ссылка
Bootstrap 4
Da Bootstrap 4 flexbox ist, ist jetzt eine beliebige Anzahl von Spalten mit gleicher Breite möglich, indem Sie auto verwenden -Gitterraster ..
%Vor%Demo: Ссылка
Erweitere meine Antwort hier: Ссылка
Hier ist eine Demonstration einer acht breiten Bootstrap-Zeilenstruktur mit
Dieses CSS wird zusätzlich zu Bootstrap benötigt
%Vor%
Um die Logos zu positionieren, verwende ich entweder <img class="img-responsive">
oder wenn sie kleiner als die Spaltenbreite sind, könnten Sie CSS mit text-align:center
zentrieren (oder die Bootstrap-Klasse text-center
auf der% co_de platzieren) %) oder mit folgendem CSS:
Klingt so, als wäre dies ein bestimmtes Modul, also würde ich einfach ein einfaches neues Gitter dafür erstellen ...
%Vor% Es ist einfach ... Fügen Sie einfach eine weitere Spalte zu Ihrem CSS hinzu.
Es ist am besten, Bootstrap-CSS nicht zu bearbeiten (und eine CDN zu verwenden).
Also ... Wir müssen die Spalte css für alle Bildschirmtypen erstellen.
Ich adressiere normalerweise 3 Bildschirmgrößen, was bedeutet, 3 CSS-Sätze für diese Spalte zu erstellen.
Entscheidungszeitpunkt:
Da wir über 8 Spalten sprechen, ist das eine Menge
es ist am besten, mit diesen CSS-Regeln (meiner Meinung nach)
ich verwende fast immer eine .container-klasse für meine designs, die
macht den Großbildmodus im Tablet-Modus geeignet, außer im Hochformat.
Kurz gesagt, hier sind eine gute Reihe von CSS-Regeln
%Vor% Bitte beachten Sie:
Ich spiele mit Padding herum, wie ich es für richtig halte. Es ist am besten, wenn Sie im mobilen Modus einige zusätzliche Polsterung lassen, aber Sie können damit herumspielen;)
Tags und Links css css3 twitter-bootstrap twitter-bootstrap-3