怎样才能让盒子变大呢？

Question

这是我的联系人表单和带有徽标的页脚。当弹出错误时，按钮隐藏在页脚下，如何使联系人窗体展开或页脚向下？

​

​

这是我的联系人表单的css

element.style {
}
.vincent_reservation_full .vincent_reservation_block {
    background: transparent;
    padding: 100px 205px 105px 205px;
    position: relative;
}
.vincent_reservation_block {
    padding: 102px 100px 105px 100px;
    text-align: center;
    background-image: url(../img/back_1.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}
* {
    margin: 0;
    padding: 0;
}
* {
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-overflow-scrolling: touch;
}
*, *:before, *:after {
    box-sizing: inherit;
}
user agent stylesheet
div {
    display: block;
}
body {
    width: 100%;
    overflow-x: hidden;
    font-family: "Open Sans";
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
    color: #dce4e8;
    background-color: #121618;
    -webkit-font-smoothing: antialiased;
}
body {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: #313439;
    background-color: transparent;
}
html, body {
    font-size: 16px;
    line-height: 24px;
}
user agent stylesheet
html {
    color: -internal-root-color;
}
*, *:before, *:after {
    box-sizing: inherit;
}
*, *:before, *:after {
    box-sizing: inherit;
}

这是我的页脚css

element.style {
}
footer {
    border-top: 1px solid #1d2326;
    color: #ffffff;
    text-align: center;
}
.vincent_menu>li>a, footer, .vincent_infobox_content h5, .vincent_advantages_item_dark h4, .vincent_collapse_item_content a:hover, .vincent_slider_main_item_text, .vincent_slider_main_item_cont h1, .vincent_slider_main_item h1, .vincent_slider_main_item h2, .vincent_slider_main_item_text, .vincent_post_item .vincent_button_background:hover, .vincent_slider_price, .vincent_hom4_block2_button:hover, .vincent_404_content_wrapper h1, .vincent_404_text, .vincent_sharing a:hover {
    color: #ffffff;
}
* {
    margin: 0;
    padding: 0;
}
* {
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-overflow-scrolling: touch;
}
*, *:before, *:after {
    box-sizing: inherit;
}
user agent stylesheet
footer {
    display: block;
}
body {
    width: 100%;
    overflow-x: hidden;
    font-family: "Open Sans";
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
    color: #dce4e8;
    background-color: #121618;
    -webkit-font-smoothing: antialiased;
}
body {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: #313439;
    background-color: transparent;
}
html, body {
    font-size: 16px;
    line-height: 24px;
}
user agent stylesheet
html {
    color: -internal-root-color;
}
*, *:before, *:after {
    box-sizing: inherit;
}
*, *:before, *:after {
    box-sizing: inherit;
}

如何解释联系人表单并显示“提交”按钮？

Answer 1

你会遇到这个问题，因为错误会产生额外的空间。使您的联系人表单部分(包装器)的高度从100%到最小高度: 100%，这样当出现错误时，所有内容都可以扩展和适应