html - 如何并排对齐图像和表格，同时将它们居中？

Question

<div class="image">
</div>
<div class="form">
</div>

.image{
  float:left;
}

.form{
  float:left;
}

这会将它们并排放置在屏幕的左侧。但是我怎样才能使它们居中呢？

Answer 1

你必须改变所有的行为。首先像这样包装 html:

<div class="wrapper">
    <div class="image">
    </div>
    <div class="form">
    </div>
</div>

还有 CSS:

.wrapper {
    text-align : center;
}
.image, .form {
    display: inline-block;
    vertical-align: top;
}