Ich habe ein Twitter-Bootstrap-Layout mit zwei Spalten und möchte einen Iframe in einem der Bereiche (er enthält das Google-Aufgaben-Widget - Ссылка ). Wie stelle ich die Breite richtig ein? Ich habe herausgefunden, wie man den Stil so einstellt, dass er einen Rand hat (um ihn als externen Seiteninhalt zu unterscheiden), aber ich kann nicht erreichen, dass er eine der Spalten richtig füllt. Das habe ich derzeit:
%Vor%Vollständiges Beispiel (als HTML-Datei speichern): Ссылка
Verwenden Sie die Klasse row-fluid
zum Definieren einer Zeile und die spanX-Klassen zum Definieren von Spalten. Wie so:
Allerdings: Die Xs in spanX
müssen für jede Zeile bis zu 12 addieren. Im obigen Beispiel müssten Sie also den Inhalt der anderen Spalte in ein Tag mit der Klasse span6
umbrechen oder Sie können die Klasse offset6
für das iframe verwenden, wenn dies der einzige Inhalt in dieser bestimmten Zeile ist um es rechts auszurichten.
Damit eine Spalte breiter als die andere ist, können Sie sie ändern, indem Sie das X in spanX
ändern. Achten Sie darauf, dass sie für eine Zeile bis zu 12 ergibt.
Wenn Sie sich fragen, wie Sie eine Spalte auf eine bestimmte Breite bringen können: Der ganze Punkt eines fließenden Gitters besteht darin, nicht bestimmte Breiten zu verwenden. Sie legen die Breite des Containers fest (vorzugsweise mit relativen Einheiten, damit sich der Inhalt an die Größe des Ansichtsfensters anpasst), und jede Spalte ist 1/12 der Breite des Containers. Wenn Sie tun möchten, dass die Breite genau gesteuert wird, können Sie dem Container immer eine bestimmte Breite zuweisen, damit die gewünschte Spalte eine Breite von 1/12 der Breite des Containers haben kann. I.e. Wenn Sie möchten, dass die Spalte 400 Pixel breit ist, können Sie den Container 800 Pixel breit machen und die Klasse span6
für die Spalte verwenden. Oder verwenden Sie span3
, um es 200px breit usw. zu machen.
Ich habe alles sehr gut in den Dokumenten erklärt: Ссылка
Tags und Links css twitter-bootstrap column-width