我正在设计一个带有联系表格的联系页面。我的页面主题有一个白色的矩形。当我添加文本时，矩形会扩展以容纳新内容。这是可取的。（例如： http: //nspowers.org/q/form/theme-example-style.html）。
但是，在联系表单页面上，表单标签导致矩形元素的行为不同，我不知道为什么。它不扩展；相反，它只显示一条细线：（示例： http: //nspowers.org/q/form/contact-form.html）
我想学习如何将表单放置在矩形内，所以有一个顶部和底部的白边，就像在主题示例页面上一样。如果我还需要提供其他任何东西，请告诉我。
这是适用的CSS
body {
background-color:#E7E7E7;
overflow:scroll;
}
/* Typography */
h1 {
font-size: 17px;
text-transform: uppercase;
line-height:0.9em;
font-family: 'Courgette', cursive;
color:#C72207;
}
h2 {
font-family: 'Strait', sans-serif;
font-size:12px;
}
h3 {
font-size: 34px;
text-transform:none;
line-height: 0.8em;
font-family: 'Courgette', cursive;
color:#C72207;
margin-bottom:14px;
}
h4 {
font-size: 60px;
text-transform:none;
line-height: 0.02em;
font-family: 'Source Sans Pro', sans-serif;
color:#454545;
font-weight: normal;
margin-left:0px;
display:block;
}
h5 {
font-size: 12px;
color:#fe7134;
text-transform: uppercase;
}
h6 { font-size: 1px; line-height: 21px;
}
p { margin: 0 0 14px 0; font-family: 'Arimo', sans-serif; line-height:140%; text-decoration:none;
}
#divider {
width: auto;
height: 1px;
background: #BDC3C7;
margin-top: 10px;
}
/* Home Page */
.block-front {
margin-left: auto;
margin-right: auto;
width: auto;
display: block;
margin-top:50px;
background-color:#FEFEFE;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FEFEFE;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FEFEFE;
-webkit-box-shadow: 0 10px /*Changes depth*/ 4px -5px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) ;
-moz-box-shadow: 0 10px /*Changes depth*/ 4px -5px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) ;
box-shadow: 0 10px /*Changes depth*/ 4px -5px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) ;
}
.block-initial {
display: inline-block;
*display:inline;/* For IE7*/
*zoom:1;/* For IE7*/
display:block;
margin:auto;
width:90%;
text-align:center;
}
.block_text {
margin:auto;
width:60%;
display: inline-block;
*display:inline;/* For IE7*/
*zoom:1;/* For IE7*/
display:block;
}