Question

我正在使用此模板：http://www.responsivewebmobile.com/app/webroot/rwm_carousel_fullscreen/（它的引导程序3）

当然，根据需要进行修改，即照片，文字。

我试图将徽标添加到其中，并使其居中。

我所做的一切都让它居中。

这是我尝试过的一个变体：

<div class="container">
<div id="logo" class="span12">
    <img class="img-circle" src="url address here" />
</div>

这是我附在徽标ID上的CSS：

            z-index: 100;
        position:absolute;
       /* width: 100%; */
    margin-left: auto;
        margin-right: auto; 
        float:none;

无论我做什么，它根本不是中心。

有什么建议吗？

Answer 1

如何：

#logo {
 text-align:center;
}

看小提琴 - http://jsfiddle.net/UE5M5/

Answer 2

尝试这种方法

<div class="container">
<div class="container">
<div id="logo" class="center">
    <img class="img-circle" src="https://www.google.com/images/srpr/logo11w.png" />
</div>
</div>


.center
{
margin:auto;
width:70%;
background-color:#b0e0e6;
}

http://jsfiddle.net/r6rQV/

Answer 3

left: 50%;
position: absolute;
top: 50%;
z-index: 1;

到屏幕的中心。

Answer 4

这是迄今为止我学到的关于居中的最有用的技巧：

Read it here

不久之后，您的徽标需要具有以下css属性：

  {
  position:absolute;
  left:50%;
  top: 50%;
  margin-left: -111 ; /* 1/2 the width of your logo */
  margin-top: -111; /*1/2 the height of your logo */

  }

我希望有所帮助！

p.s它适用于具有设定高度和宽度的所有东西（例如div标签）

Answer 5

#lgoo {width: 100%;}
#logo img {margin: 0 auto; display: block;}

徽标不居中

5 个答案: