div css如何实现子DIV水平居中???

外面的DIV宽度不定。里面有个子DIV宽度也不定。这种情况下。如何实现子DIV的宽度剧中??<divclass="find_center"><DIVid="find_bu... 外面的DIV宽度不定。 里面有个子DIV宽度也不定。这种情况下。如何实现子DIV的宽度剧中??

<div class="find_center">
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
<DIV id="find_button">
<DIV class="find_button_left"></DIV>
<DIV class="find_button_center"><a href="#">查询查询查询查询查询查询</a></DIV>
<DIV class="find_button_right"></DIV>
</DIV>
</div>

我要实现3个FIND_BUTTON水平剧中
展开
 我来答
hmliakop
2018-12-23 · TA获得超过1731个赞
知道答主
回答量:21
采纳率:0%
帮助的人:9155
展开全部

1、实现div下只有一个子div的水平居中办法如下:

.continer{

height:100px;

width:100px;

background-color:aqua;

text-align: center;//内联元素,使用text-align属性,可以修改对齐方式

}

.child{

display: inline;//将子div设置为内联元素

}

<div class="continer">

<div class="child">我是子div</div>

</div>

2、实现div下只有多个子div的水平居中,思路是在多个子div外面再加一个div(假设命名为inner),同时inner设置为水平居中margin:0 auto,然后将多个子div设置在同一行,同时水平居中。代码如下:

.continer{

height:100px;

width:500px;

background-color:aqua;

text-align: center;

}

.inner{

margin:0 auto;

text-align: center;

background-color:chartreuse

}

.child{

display: inline-block;

vertical-align: top;

background-color: coral

}

<div class="continer">

<div class="inner">

<div class="child">我是子div1</div>

<div class="child">我是子div2</div>

<div class="child">我是子div3</div>

</div>

</div>

扩展资料:

使元素水平居中的几种方法:

1、如果是内联元素,比如span,img,a,input等,直接使用text-align:center

2、如果是块级元素,比如h1-h6标题元素,div,p,form,section等,方法如下:

1)父元素使用margin:0 auto

2)将块级元素设置为内联元素,使用display:inline;或者disply:inline-block;

3、使用flex布局,代码如下:

.box {

display: flex;

justify-content: center; /* 水平居中 */

align-items: center;     /* 垂直居中 */

width: 1000px;

height: 600px;

border: 1px solid red;

}

.inner {

width: 300px;

height: 200px;

background-color: red;

}

<div class="box">

<section class="inner"></section>

</div>

o求知小生o
2012-11-20
知道答主
回答量:16
采纳率:0%
帮助的人:4.7万
展开全部
其实很简单,大不了再多加一个DIV,你肯定是这个大DIV(find_center)中还有别的东西要放对吧?你把这三个小DIV再放到一个DIV(给个名字叫center吧)中,如下:
#center{
margin:0 auto;
}

<div class="find_center">
<div id="center" >
(中间就是你那三个DIV)

</div>

</div>

当然最好不要以center命名,还有,你class不应该在id的外层,class=“name”,name是可以重复的,id="id",id是不能重复的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
xhnonline
2011-04-28 · TA获得超过5570个赞
知道小有建树答主
回答量:849
采纳率:0%
帮助的人:744万
展开全部
使用margin:0px auto;
为子div设置上下边距0px(可变),然后设置其左右边距为auto自动。
追问
试过了。不可以的。我这个情况比较麻烦。是一个大DIV(宽度不定)里面有3个子DIV(宽度不定)。之后3个子DIV里又有3个DIV。我要实现里面3个子DIV在整个页面剧中。因为里面3个是按钮。文字可能有多有少。不能固定宽度。所以很麻烦。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
rockey329
2011-04-28 · TA获得超过195个赞
知道小有建树答主
回答量:203
采纳率:0%
帮助的人:148万
展开全部
宽度不定,怎么知道哪里开始,哪里结束,加个宽度
margin:0px auto;
更多追问追答
追问
我这个情况比较麻烦。是一个大DIV(宽度不定)里面有3个子DIV(宽度不定)。之后3个子DIV里又有3个DIV。我要实现里面3个子DIV在整个页面剧中。因为里面3个是按钮。文字可能有多有少。不能固定宽度。所以很麻烦。
追答
你把代码贴出来,帮你看看
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
surybai
2012-09-13 · TA获得超过440个赞
知道答主
回答量:265
采纳率:0%
帮助的人:232万
展开全部
margin:0 auto
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(8)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式