将div中的浮动链接居中

时间:2012-01-23 21:32:52

标签: css centering

我有一个只有最小宽度的div,它可以像100%宽度那样延伸。

在里面,我有一个左侧浮动的链接,我很想找到一种方法将它放在div中。

如果不改变浮动,我怎么能这样做呢?

哦,链接没有用

定义

编辑:

我试过了:

我给容器一个text-align:center, 删除浮动,但它没有居中,但没有与其他元素对齐,我尝试使用display:inline和vertical-align。

对于代码我试图将“项目名称”置于中心http://twitter.github.com/bootstrap/examples/fluid.html

4 个答案:

答案 0 :(得分:1)

希望这会有所帮助:

http://jsfiddle.net/cU2ff/

修改

http://jsfiddle.net/cU2ff/1/

我想出了这个,不知道它是否会有所帮助。 float:left属性没有做什么,但我把它留在那里

<div id='container'>
 <a id='projectName' href='#'>Ciaoasdsa da sda sd asd adsa</a>
 <ul id='menu'><li>li1</li><li>li2</li></ul>
 <p id='login'><a>asd</a></p>
</div>

#container 
{
 width:100%;
 position:relative;
 overflow:hidden;
 border: 1px solid black;
}

li { float: left; } 

#menu, #login { border: 1px solid black; }

#menu{ float:left; }

#login { float:right; }

#projectName
{
 text-align: center;
 border:1px solid red;
 padding:3px;
 width: 100%;
 position: absolute;
 float: left;
}

修改

http://jsfiddle.net/cU2ff/2/

用div包装并给它id projectName

答案 1 :(得分:0)

我通常在div中使用这个链接。

div.name a
{
margin-left:auto;
margin-right:auto;
}

答案 2 :(得分:0)

如果没有能够看到你正在谈论的HTML,那么给你一个答案有点困难,但如果它只是链接中的文字就试试这个。

a{
 display:block;
 text-align:center;
 width:100%;
}

答案 3 :(得分:-1)

尝试使用此

a{
margin:0 auto;
}