我已经阅读了一些关于将一些文字集中在div中的Q& A但是由于某种原因我尝试的例子对我不起作用。我使用了一些jquery-ui和jquery-mobile css库,但我不认为这是我的问题。 "蓝色按钮"似乎在中间垂直对齐就好了。但为什么不在两个文本列中呢?
以下是jsfiddle链接:http://jsfiddle.net/Thread7/tstwwt9p/
<br/><br/>
<div class="ui-grid-b" style="display: table;width: 100%;border-style: solid;">
<div class="ui-block-a" style="text-align:center;">
<button style="color:#000;background-color:#00b2ee" class="ui-btn ui-shadow ui-corner-all" type="button">Blue Button</button>
</div>
<div class="ui-block-b " style="text-align:center;display: table-cell;">Middle Column Text</div>
<div class="ui-block-c" style="text-align:center;"><a href="#" class="ui-link">Sample Link Text</a></div>
</div>
答案 0 :(得分:1)
您不需要使用display:table和table-cells来实现垂直居中,尽管它是单向的。
在处理小的单行文本时,我发现将高度和行高设置为相同的值更简单,如下所示:
<div class="ui-grid-b" style="width: 100%;border-style: solid;">
<div class="ui-block-a" style="text-align:center;height:60px;line-height:60px;">
<button style="color:#000;background-color:#00b2ee" class="ui-btn ui-shadow ui-corner-all" type="button">Blue Button</button>
</div>
<div class="ui-block-b " style="text-align:center;height:60px;line-height:60px;">Middle Column Text</div>
<div class="ui-block-c" style="text-align:center;height:60px;line-height:60px;"><a href="#" class="ui-link">Sample Link Text</a></div>
</div>
答案 1 :(得分:0)
试试这个:
.factory('presentationData', ['$indexedDB', 'uuid4','$q', function ($indexedDB, uuid4, $q) {
var objectStore = $indexedDB.openStore('presentations', function(store) {
return store;
});
return objectStore.then(function(objectStore) {
var functions = getDefaultDataServiceFunctions(objectStore);
functions.getAll = function (includeFlaggedForDelete) {
if (includeFlaggedForDelete) {
return objectStore.getAll();
}
return objectStore.getAll().then(function (presentations) {
return presentations.filter(function (p) {
return !(p.meta && p.meta.localStatus === 'deleted');
});
});
};
functions.getWithLocalStatus = function (status) {
var query = $indexedDB.queryBuilder().$index('localStatus').$eq(status).compile();
return objectStore.each(query);
};
return functions;
})
}])