Bootstrap 响应式水平布局 [英] Bootstrap responsive horizontal layout

问题描述

我有一个 Bootstrap 布局，但我需要它具有响应性，但不确定如何水平执行此操作.

I have a Bootstrap layout but I need it to be responsive and not sure how to do this horizontally.

如何使用标准的 Bootstrap 布局来制作该布局，同时又使其具有响应性?我目前将它与一个流体行中的标签"和另一个流体行中的输入一起使用，但是当它缩小"时，标签不再适合输入.

How can I make that layout using standard Bootstrap layout but also have it be responsive? I currently have it with the "labels" in one fluid row and the inputs in another fluid row but when it is "shrunk", the labels no longer fit with the inputs.

推荐答案

您是否考虑过通过在单个 .row-fluid 中创建五个 .span 并在每个 span 中再添加两个 .row-fluid 来进行嵌套?这样只有一个顶级行，标签/字段应该保持在一起.

Have you considered nesting by making a single .row-fluid with five .spans inside it and two more .row-fluids inside each span? This way there is only one top level row, and the labels/fields should stay together.

http://jsfiddle.net/hmartiro/D2RLR/1726/

这篇关于Bootstrap 响应式水平布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！