html - 带有列的面板页脚 Bootstrap ,它不会出现在同一行中

标签 html twitter-bootstrap css

我想在 Bootstrap 中有一个包含三列的面板页脚。

左侧第一列中的文本和右侧其他列中的两个图标。

代码如下:

<div class="panel-footer clearfix">
  <div class="row">
            <div class="col-md-7"><p>Description: Chart </p>

            </div>

            <div class="col-md-1 col-md-offset-7">
                <span id="logos" class="material-icons"></span>

            </div>

            <div class="col-md-2 col-md-offset-9">
                <span id="logos" class="glyphicon glyphicon-star"></span>
            </div>
        </div>
  <div></div></div>

结果是:

enter image description here

它们似乎在不同的三排,为什么?怎么了 ?我希望符号在顶部而不是底部对齐。

最佳答案

由于-offset-*的使用不当,我解决了这个问题。

在我之前的回答中,我使用了 -offset-7 和 -offset-9,它们在范围之外。 bootstrap 中的最大列数 12 列。

<div class="row">
                <div class="col-md-9">

                    Description: {{entry.description}}


                </div>

                <div class="col-md-1">
                    <span id= "logos" class="material-icons" >&#xE85B;</span>

                </div>

                <div class="col-md-1" >
                    <span id= "logos" class="glyphicon glyphicon-star"></span>
                </div>
            </div>

关于html - 带有列的面板页脚 Bootstrap ,它不会出现在同一行中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31400297/

相关文章:

html - 将一个 div 重叠在另一个之上

javascript - 如何为页面中的所有链接添加位置子字符串

php - 表单提交 - 预验证使 IE 失效

css - 特定大小的反向 Bootstrap 堆栈。

css - 位置 : sticky issue - element appears off-placed

html - 调整浏览器大小时文本调整大小

html - Bootstrap 4 beta - cols 计算不正确

html - 用另一个类撤消应用的样式属性

html - Bootstrap 行类取消了移动 View 中的适当侧边距

html - 在 HTML 中制作一个可展开的按钮