我有2个div元素" date1'和" date2"在父export default [
{
path: '/',
component: App,
childRoutes: [
{
path: 'signup',
getComponent(location, cb) {
System.import('./modules/App/components/Authentication/Login.js')
.then(loadRoute(cb))
.catch(errorLoading);
}
}
]
}
]
日期。我可以把它们放在一起但是左右对齐。但我希望他们在 center 彼此相邻,如[o o] not [oo]
div
答案 0 :(得分:1)
尝试使用flex:
#date1 {
background-color:green;
float: left;
width: 32%;
height:200px;
text-align: center;
padding: 2px;
}
#date2 {
float: left;
width: 32%;
height:200px;
text-align: center;
padding: 2px;
background-color:blue;
}
.row{
width:100%;
margin:0;
padding:0;
display:flex;
justify-content:center;
}
<div class="container-fluid">
<div class="row">
<div id="date1">
</div>
<div id="date2">
</div>
</div>
</div>
答案 1 :(得分:0)
使用display:inline-block;
<div class="container-fluid">
<div class="row">
<div id="date1">
</div>
<div id="date2">
</div>
</div>
</div>
css将是
.row{
display:inline-block;
width:100%;
//your other css
}
.date1 .date2{
vertical-align:top;
//your other css
}
答案 2 :(得分:0)
使用
display:inline-block
而不是
'float:left'.
试试这个小提琴
https://jsfiddle.net/92q5xr3p/