gpt4 book ai didi

html - clearfix问题,在同一行匹配

转载 作者:行者123 更新时间:2023-11-28 00:57:16 25 4
gpt4 key购买 nike

尝试在同一行左右浮动,无法准确地正确地进行 clearfix。

表格向下移动,没有问题,但 p-tag 和搜索框在同一行不匹配。这实际上是基本的事情,但需要帮助。抱歉,添麻烦了。

.clearfix::after {
content: "";
clear: both;
display: table;
}

.row {
width: 50%;
margin: 0 auto;
padding: 100px;
color: #395870;
}

.nav-p {
float: left;
color: #395870;
}

.search-box {
float: right;

}
<body>
<div class="row">
<p class="nar-p"><i class="fa fa-building" style="font-size:24px"></i>販売概要</p>
<div class="clearfix">
<form action="{{ route('search.route')}}" method="any" role="search" class="search-box">
{{csrf_field()}}
<input type="text" name="q" class="search" placeholder="町, 地域, 会社名, 物件名" onfocus=" ">
<input type="submit" name="submit" class="submit" value="検索">
</form>
</div>

<table>
<tr>
<th scope="row">物件名</th>
<td>{{$estates->building_name}}</td>
</tr>
<tr>
</table>
</div>
</body>

最佳答案

将html代码nar-p改为nav-p

.clearfix::after {
content: "";
clear: both;
display: table;
}

.row {
width: 50%;
margin: 0 auto;
padding: 100px;
color: #395870;
}

.nav-p {
float: left;
color: #395870;
}

.search-box {
float: right;

}
<body>
<div class="row">
<p class="nav-p"><i class="fa fa-building" style="font-size:24px"></i>販売概要</p>
<div class="clearfix">
<form action="{{ route('search.route')}}" method="any" role="search" class="search-box">
{{csrf_field()}}
<input type="text" name="q" class="search" placeholder="町, 地域, 会社名, 物件名" onfocus=" ">
<input type="submit" name="submit" class="submit" value="検索">
</form>
</div>

<table>
<tr>
<th scope="row">物件名</th>
<td>{{$estates->building_name}}</td>
</tr>
<tr>
</table>
</div>
</body>

关于html - clearfix问题,在同一行匹配,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52888233/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com