推荐关注 Meteor JSLint - a Javascript code quality tool jsFiddle D3.js WebStorm 推荐书目 Javascript 权威指南第 5 版
Closure: The Definitive Guide
Closure: The Definitive Guide 
这是一个创建于 2839 天前的主题，其中的信息可能已经有所发展或是发生改变。
<div class="container"> <div class="container-fluid"> <div id="searchArea"> <div id="searchCriteriaArea"> <div class="row" style=""> <div class="col-md-1" style="display: inline-block;"> 物品类型 </div> <div class="col-md-4"> <select id="usertype" name="usertype" class="selectpicker show-tick form-control" multiple data-live-search="false"> <option value="0">苹果</option> <option value="1">菠萝</option> <option value="2">香蕉</option> <option value="3">火龙果</option> <option value="4">梨子</option> </select> </div> </div> </div> <div id="searchTable"> </div> </div> </div> </div> 代码比较简单，现在问题是: class="row"的这个 DIV，高度是自动生成的 34。它的下面有 2 个 col 的 DIV，第一个高度是 20，但是是向上对齐的，第二个高度是 34，撑满了父元素。 这样就很难看了
我想让第一个 col，向下去一点点，高度上居中，网上搜了很多教程：
- 好像我这个是“父元素高度未知”，因此很多手段不能用
- 有个教程是这样的： #container{ display:table-cell; text-align:center; vertical-align:middle; }
#center{
} 但是我用了之后更糟糕了，初步排查是 table-cell 这个样式造成的
感觉这个业务应该满大街都是的，说白了就是 bootstrap 的一个 row 下，有两个 col，我想让两个 col 在高度上都居中，谷歌了好久还是搞不定。在这里发帖一是想规避一下问题，第二也想了解一下机制
V2EX 前端的同学很多，感觉问题也比较简单，希望大家不吝赐教哈
第 1 条附言 2018-01-24 16:27:12 +08:00
谢谢大家，10L 的方法是可以用的
我最后直接用了 layUI 这里也算打个广告把，官方哪里有很多例子，直接抄就行了
对于我这种后端程序员，我写前端只是显示数据（换句话说什么都可以换，不用遵从什么设计文档）
这个库是最方便的
我最后直接用了 layUI 这里也算打个广告把，官方哪里有很多例子，直接抄就行了
对于我这种后端程序员，我写前端只是显示数据（换句话说什么都可以换，不用遵从什么设计文档）
这个库是最方便的
 | 1 whx20202 OP  |
 | 3 zhlssg 2018-01-06 03:19:39 +08:00 display: inline-flex;align-items: center; |
 | 4 zhlssg 2018-01-06 03:21:06 +08:00 再加上 justify-content: center;吧，最好能把代码放到 jsfiddle 或者 codepen，这样直观啊 |
 | 5 lzvezr 2018-01-06 07:46:05 +08:00 via iPhone V4 的话可以在 row 加.align-items-center，并且固定 row 的高度，看命名和 #3 应该差不多 |
 | 6 jy02534655 2018-01-06 09:08:58 +08:00 高宽如果固定的话，只是物品类型这几个字可以通过指定内边距或者行高来居中 |
 | 7 wzhndd2 2018-01-06 09:29:36 +08:00 我都是使用 transform 的 50%来做垂直居中，觉得你最好还是 jsfiddle 或者 codepen，这样好帮着你调试看 |
 | 8 chotow 2018-01-06 09:32:27 +08:00 |
 | 9 forestyuan 2018-01-06 10:12:39 +08:00 用 table 元素可以做到吧 |
 | 10 jkeylu 2018-01-06 10:40:20 +08:00 |
 | 11 gen900 2018-01-06 14:46:43 +08:00 flex 或者 margin-top 伪造一个剧中效果 |
 | 12 Mystic0 2018-01-24 16:22:25 +08:00 用 line-height 让左侧文字居中就好了 |
Select Language