Ich habe zwei Inline-divs, die die Breite der Eltern in der Breite überschreiten. Daher springt das zweite Div zur nächsten Zeile: Ссылка
Wie kann ich beide Divs auf der gleichen Linie halten?
Das Hinzufügen von overflow:hidden; zu div.a blendet einfach das zweite div.
Theres ein paar Möglichkeiten, dies zu tun. Zuallererst können Sie display: inline-block; oder float: left; verwenden, um die divs nebeneinander zu setzen. Sie arbeiten anders, also achten Sie darauf, den richtigen für Ihren Fall zu verwenden.
Zweitens wird keiner von beiden funktionieren, es sei denn, das enthaltende div (a) ist groß genug, um beide Divs in derselben Zeile zu enthalten. Oder Sie können overflow: hidden; für das enthaltende div (a) verwenden.
Bearbeiten:
Ich habe Ihr Beispiel aktualisiert: Ссылка
Ich musste white-space: nowrap; verwenden, da die inneren divs umschlossen waren.
Hier ist eine weitere Antwort, die auch Ihre Frage beantwortet: CSS: Wie kann man verhindern, dass Text mehr als eine Zeile aufnimmt?
Beachten Sie, dass die Verwendung von display: inline-block das Element grundsätzlich als Text behandelt, so dass die meisten css-Eigenschaften für Textformatierung darauf angewendet werden.
Inline-Elemente verhalten sich ähnlich wie Text. Wenn Sie das Umbrechen verhindern möchten, entfernen Sie entweder den Leerraum, den Sie für die Formatierung verwendet haben, oder fügen Sie white-space:nowrap; zur Regel für .a hinzu.
Hier ist eine Demonstration: Ссылка