Question

我是制作自适应网页的新手。当表单的标签高度增加时，我无法推送内容。当窗体长度小，页面宽度增大时，窗体的标签不会将橙色框向下推。我的代码在这里：

＆＃13;

<html>
<head>
	<style type="text/css">
		#form{
			z-index: 2;
			position:relative;
			width: 35.42%;
			margin-left: 32.71%;
		}

		.column {
			display: inline;
			float: left;
			clear: both;
		}

		#formDiv{
			z-index: 3;
    		position: relative;
    		margin-right: -10000px;
    		width: 100.59%;
    		left: 0.3%;
		}

		#label {
    		z-index: 4;
    		min-height: 28px;
    		line-height: 14px;
   	 		text-align: left;
    		font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    		position: relative;
    		margin-right: -10000px;
    		width: 30%;
		}

		.leftinline{
    		display: inline;
    		float: left;
		}

		#input {
    		z-index: 8;
    		min-height: 26px;
    		background-color: orange;
    		position: relative;
    		margin-right: -10000px;
    		margin-top: 27px;
    		width: 50%;
		} 
	</style>
</head>
<body style="word-wrap:break-word;margin-top:30px;width:100%">
	<form class = "column" id="form" action="/action_page.php">
		<div id="formDiv">
			<label class="leftinline" id="label">
				<span>Nameeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee</span>
			</label>
			<span class="leftinline" id="input"></span>
		</div>
	</form>
</body>
</html>

＆＃13;

任何人都可以帮助我吗？感谢

Answer 1

由于header("location: ../index.php"); exit;和label是浮动的，只要有足够的空间，它们就会并排堆叠，因此要强制换行，请通过添加{{1}来清除浮动} {到span规则

＆＃13;

clear: left;

＆＃13;

响应式表单标签不会降低内容

1 个答案: