Question

我正在尝试居中（margin auto）div，父div是相对的。

<div id="header-layout">
        <div class="left">
            <div class="facebook-like">
                <div class="fb-like" data-href="http://developers.facebook.com/docs/reference/plugins/like" data-layout="button_count" data-show-faces="true" data-send="false"></div>
            </div>

            <div class="twitter-follow">
                <a href="https://twitter.com/StereoShoots" class="twitter-follow-button" data-show-count="false" data-lang="ru">Читать @StereoShoots</a>
                <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
            </div>  
        </div>

        <div class="center">
            <div class="header-center">
                trying to center this div (header-center)
            </div>
        </div>

        <div class="right">
        right
        </div>
    </div>

CSS

#header-layout { position: relative; }
#header-layout DIV { position: absolute; }

.left { background: #C7E3E4; width: 290px; }
.center { background: #E0D2C7; left: 290px; right: 200px;}
.right { background: #ECD5DE; width: 200px; right: 0; }
.facebook-like {}
.twitter-follow {left:135px;}

.header-center{width:300px;background:red;margin:0 auto;}

仍然没有以.header-center为中心 - 请解决方案！

谢谢！

Answer 1

.absolute-center {
    position:absolute;
    left:0;
    right:0;
    margin:auto;
}

居中horizontally。

将父div相对的div居中

1 个答案: