.card {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
transition: 0.3s;
}
.card:hover {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}
.container {
padding: 2px 16px;
}
.card {
width: 50%;
height: 50%;
} <!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div><input type="text" id = "1" name="dataKey" placeholder="Enter id you want to serch" required>
<button type="submit" value="Submit" onclick= goodfunction()>Submit</button></div>
<p></p>
<div class="card">
<div class="container" id="101">
<h4><b>PRODUCTID</b></h4>
<p>IT WILL DISPLAY THE PRODUCTID </P>
<h4><b>TERRITORY</b></h4>
<p1>IT WILL DISPLAY THE TERRITORY</p1>
<h4><b>LANGUAGE</b></h4>
<p2>IT WILL DISPLAY THE LANGUAGE OF MOVIE</p2>
<h4><b>STARTDATE</b></h4>
<p3>IT WILL DISPLAY THE STARTDATE</p3>
<h4><b>ENDDATE</b></h4>
<p4>IT WILL DISPLAY THE END DATE</p4>
<h4><b>EXCLUSIVITY</b></h4>
<p5>IT WILL SHOW THE EXCLUSIVITY</p5>
<h4><b>ACQUIRING DIVISION</b></h4>
<p6>IT WILL DISPLAY THE ACQUIRING DIVISION</p6>
<h4><b>PRODUCT TITLE</b></h4>
<p7>IT WILL DISPLAY THE PRODUCT TITLE</p7>
<h4><b>MEDIA</b></h4>
<p8>IT WILL DISPLAY THE MEDIA RIGHTS</p8>
<h4><b>FORMAT</b></h4>
<p9>IT WILL DISPLAY THE FORMAT</p9>
<h4><b>OWNER</b></h4>
<p10>IT WILL DISPLAY THE OENER OF THE MPVIE</p10>
</div>我创建了一张卡片我想在同一张卡片中分两列显示数据
我使用了 50% 的 div 宽度，但我无法分割它，所以最终用户不会向下滚动
请帮帮我，我已经使用了所有的分割工具，但我无法分割它
提前致谢
最佳答案
.container {
width: 100%;
}
.row {
display: flex;
justify-content: center;
text-align: center;
}<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
.card {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
transition: 0.3s;
}
.card:hover {
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}
.container {
padding: 2px 16px;
}
</style>
</head>
<body>
<div><input type="text" id="1" name="dataKey" placeholder="Enter id you want to serch" required>
<button type="submit" value="Submit" onclick=g oodfunction()>Submit</button></div>
<p></p>
</div>
</div>
<div class="card">
<div class="container" id="101">
<div class="row">
<div>
<h4><b>PRODUCTID</b></h4>
<p>IT WILL DISPLAY THE PRODUCTID </P>
<h4><b>TERRITORY</b></h4>
<p>IT WILL DISPLAY THE TERRITORY</p>
<h4><b>LANGUAGE</b></h4>
<p>IT WILL DISPLAY THE LANGUAGE OF MOVIE</p>
<h4><b>STARTDATE</b></h4>
<p>IT WILL DISPLAY THE STARTDATE</p>
<h4><b>ENDDATE</b></h4>
<p>IT WILL DISPLAY THE END DATE</p>
<h4><b>EXCLUSIVITY</b></h4>
<p>IT WILL SHOW THE EXCLUSIVITY</p>
</div>
<div>
<h4><b>ACQUIRING DIVISION</b></h4>
<p>IT WILL DISPLAY THE ACQUIRING DIVISION</p>
<h4><b>PRODUCT TITLE</b></h4>
<p>IT WILL DISPLAY THE PRODUCT TITLE</p>
<h4><b>MEDIA</b></h4>
<p>IT WILL DISPLAY THE MEDIA RIGHTS</p>
<h4><b>FORMAT</b></h4>
<p>IT WILL DISPLAY THE FORMAT</p>
<h4><b>OWNER</b></h4>
<p>IT WILL DISPLAY THE OENER OF THE MPVIE</p>
</div>
</div>
</div>关于javascript - 我想在同一张卡片中显示数据作为两列任何建议，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50829726/