使用引导程序在 div 中间对齐所有对象答案

【问题标题】：Align all object in the middle of a div using bootstrap使用引导程序在 div 中间对齐所有对象
【发布时间】：2013-07-19 14:24:37
【问题描述】：

我希望有人可以帮助我，下面是一个 jsfiddle。

http://jsfiddle.net/dcsKt/4/

这是 js：

$(document).ready(function() {
var originalFontSize = 12;
var sectionWidth = $('.web-message').width();

$('.web-message span').each(function(){
    var spanWidth = $(this).width();
    var newFontSize = (sectionWidth/spanWidth) * originalFontSize;
    $(this).css({"font-size" : newFontSize, "line-height" : newFontSize/1 + "px"});
});
});

如果您更改任何文本，它会与左右对齐，这是完美的，但我遇到的问题是当您缩小屏幕时。

我希望它逐渐变小并留在容器中间，或者最坏的情况是使用@media 变小

有什么想法吗？

【问题讨论】：

标签： javascript jquery css wordpress twitter-bootstrap

【解决方案1】：

如果我理解正确，您只需要使用$(window).resize。见这里：

http://jsfiddle.net/dcsKt/5/

$(window).resize(function() {
    var originalFontSize = 12;
    var sectionWidth = $('.web-message').width();

    $('.web-message span').each(function(){
        var spanWidth = $(this).width();
        var newFontSize = (sectionWidth/spanWidth) * originalFontSize;
        console.log(newFontSize);
        $(this).css({"font-size" : newFontSize+"px", "line-height" : newFontSize/1 + "px"});
    });
});

这就是你要找的吗？

【讨论】：