ul / li下拉不对齐左边？
我正在尝试为我的设置页面选项卡创建一个下拉列表，现在它在桌面上打开时没有问题，但在移动设备/平板电脑上打开或缩小浏览器大小我的标签菜单都被“粉碎” “从某种意义上说。看起来它正在下降到右边，如果它向左下降它可能会修复它。无论如何都不知道，所以我想知道是否有人知道如何解决这个问题？
CURRENT DESKTOP示例
当前移动示例
我希望看到的方式
HTML
<body>
<div id="header">
<div id="headerTitle">
<p>Project Archive</p>
</div>
<div id="nav">
<ul>
<li class="navOn"><a class="active" href="Home.php">Home</a></li>
<li><a href="Home.php">All</a></li>
<li><a href="Home.php">Categories</a></li>
<li><a href="Home.php">Quote</a></li>
<li><a href="Home.php">Support</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">Settings</a>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</li>
</ul>
</div>
</div>
<div id="search">
<p>Search Your Documents...</p>
<form action="Home.php" method="post">
<input type="text" name="search" placeholder="search" class="tbSearch">
</form>
</div>
<div id="documents">
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</body>
CSS
@charset "utf-8";
body{
background:#E8E8E8;
overflow-x:hidden;
}
#header{
width:100%;
height:80px;
font-weight:bold;
}
#search{
height:115px;
background-color:#4C66A4;
color:#FFF;
text-align:center;
font-size:18px;
font-weight:bold;
padding-top:10px;
}
#navTop{
height:5px;
margin-bottom:20px;
background-color:#4C66A4;
}
#documents{
width:100%;
height:100%;
}
#docGrid{
height:225px;
margin-left:10%;
margin-right:10%;
margin-top:20px;
margin-bottom:20px;
}
#docLeft{
float:left;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docRight{
float:right;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docName{
text-align:center;
margin-top:10px;
margin-bottom:10px;
font-size:16px;
font-weight:bold;
}
#docDescription{
text-align:center;
margin-top:10px;
margin-bottom:10px;
margin-left:5px;
margin-right:5px;
height:110px;
}
#docOpen{
text-align:center;
margin-left:17.5%;
margin-right:17.5%;
margin-top:10px;
margin-bottom:10px;
}
#headerTitle{
float:left;
font-weight:bold;
font-size:20px;
text-align:center;
width:25%;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
font-size:12px;
height:80px;
}
.navOn{
border-top:3px solid #4C66A4;
height:47px;
padding-top:27px;
}
li {
float: left;
width:12%;
height:50px;
padding-top:30px;
text-align:center;
}
a:visited {
text-decoration: none;
color:#000;
}
li a, .dropbtn {
display: inline-block;
color: #000;
text-align: center;
text-decoration: none;
}
li.dropdown {
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {
background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
display: block;
}
.btnOpen{
text-align:center;
vertical-align:middle;
height:30px;
width:100%;
border-radius:5px;
background-color:#4C66A4;
color:#FFF;
font-size:15px;
font-weight:bold;
}
.headerTitle{
font-size:20px;
text-align:center;
vertical-align:middle;
font-weight:bold;
}
.tbSearch{
border: 1px solid #848484;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
outline:0;
padding-left:10px;
padding-right:10px;
margin-top:0;
margin-bottom:0;
margin-left:12.5%;
margin-right:12.5%;
width:75%;
height:25px;
font-size:15px;
}
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {
}
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
}
修改
提供给Sagar Kodte的评论示例：
3 个答案:
答案 0 :(得分：1)
尝试使用flexbox。我还为html和body元素添加了0px的边距。如果没有它你会感觉更好，请随时删除
@charset "utf-8";
html, body{
margin: 0;
padding: 0;
}
body{
background:#E8E8E8;
overflow-x: hidden;
}
#header{
width:100%;
height:80px;
font-weight:bold;
}
#search{
height:115px;
background-color:#4C66A4;
color:#FFF;
text-align:center;
font-size:18px;
font-weight:bold;
padding-top:10px;
}
#navTop{
height:5px;
margin-bottom:20px;
background-color:#4C66A4;
}
#documents{
width:100%;
height:100%;
}
#docGrid{
height:225px;
margin-left:10%;
margin-right:10%;
margin-top:20px;
margin-bottom:20px;
}
#docLeft{
float:left;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docRight{
float:right;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docName{
text-align:center;
margin-top:10px;
margin-bottom:10px;
font-size:16px;
font-weight:bold;
}
#docDescription{
text-align:center;
margin-top:10px;
margin-bottom:10px;
margin-left:5px;
margin-right:5px;
height:110px;
}
#docOpen{
text-align:center;
margin-left:17.5%;
margin-right:17.5%;
margin-top:10px;
margin-bottom:10px;
}
#headerTitle{
float:left;
font-weight:bold;
font-size:20px;
text-align:center;
width:25%;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
font-size:12px;
height:80px;
display: flex;
}
.navOn{
border-top:3px solid #4C66A4;
height:47px;
padding-top:27px;
}
li {
height:50px;
padding-top:30px;
text-align:center;
display: block;
flex: 1;
}
a:visited {
text-decoration: none;
color:#000;
}
li a, .dropbtn {
display: inline-block;
color: #000;
text-align: center;
text-decoration: none;
}
li.dropdown {
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {
background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
display: block;
}
.btnOpen{
text-align:center;
vertical-align:middle;
height:30px;
width:100%;
border-radius:5px;
background-color:#4C66A4;
color:#FFF;
font-size:15px;
font-weight:bold;
}
.headerTitle{
font-size:20px;
text-align:center;
vertical-align:middle;
font-weight:bold;
}
.tbSearch{
border: 1px solid #848484;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
outline:0;
padding-left:10px;
padding-right:10px;
margin-top:0;
margin-bottom:0;
margin-left:12.5%;
margin-right:12.5%;
width:75%;
height:25px;
font-size:15px;
}
@media only screen and (min-width: 769px) {
#header{
width: 80%;
margin-left: 5%;
}
}<body>
<div id="header">
<div id="headerTitle">
<p>Project Archive</p>
</div>
<div id="nav">
<ul>
<li class="navOn"><a class="active" href="Home.php">Home</a></li>
<li><a href="Home.php">All</a></li>
<li><a href="Home.php">Categories</a></li>
<li><a href="Home.php">Quote</a></li>
<li><a href="Home.php">Support</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">Settings</a>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</li>
</ul>
</div>
</div>
<div id="search">
<p>Search Your Documents...</p>
<form action="Home.php" method="post">
<input type="text" name="search" placeholder="search" class="tbSearch">
</form>
</div>
<div id="documents">
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</body>
答案 1 :(得分：1)
希望它对你有所帮助。的 EDITED
@charset "utf-8";
body{
background:#E8E8E8;
overflow-x:hidden;
}
#header{
width:100%;
height:80px;
font-weight:bold;
}
#search{
height:115px;
background-color:#4C66A4;
color:#FFF;
text-align:center;
font-size:18px;
font-weight:bold;
padding-top:10px;
}
#navTop{
height:5px;
margin-bottom:20px;
background-color:#4C66A4;
}
#documents{
width:100%;
height:100%;
}
#docGrid{
height:225px;
margin-left:10%;
margin-right:10%;
margin-top:20px;
margin-bottom:20px;
}
#docLeft{
float:left;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docRight{
float:right;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docName{
text-align:center;
margin-top:10px;
margin-bottom:10px;
font-size:16px;
font-weight:bold;
}
#docDescription{
text-align:center;
margin-top:10px;
margin-bottom:10px;
margin-left:5px;
margin-right:5px;
height:110px;
}
#docOpen{
text-align:center;
margin-left:17.5%;
margin-right:17.5%;
margin-top:10px;
margin-bottom:10px;
}
#headerTitle{
float:left;
font-weight:bold;
font-size:20px;
text-align:center;
width:25%;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
font-size:11px;
height:80px;
}
.navOn{
border-top:3px solid #4C66A4;
height:47px;
padding-top:27px;
}
li {
float: left;
width:16%;
height:50px;
padding-top:30px;
text-align:center;
}
a:visited {
text-decoration: none;
color:#000;
}
li a, .dropbtn {
display: inline-block;
color: #000;
text-align: center;
text-decoration: none;
}
li.dropdown {
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {
background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
display: block;
}
.btnOpen{
text-align:center;
vertical-align:middle;
height:30px;
width:100%;
border-radius:5px;
background-color:#4C66A4;
color:#FFF;
font-size:15px;
font-weight:bold;
}
.headerTitle{
font-size:20px;
text-align:center;
vertical-align:middle;
font-weight:bold;
}
.tbSearch{
border: 1px solid #848484;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
outline:0;
padding-left:10px;
padding-right:10px;
margin-top:0;
margin-bottom:0;
margin-left:12.5%;
margin-right:12.5%;
width:75%;
height:25px;
font-size:15px;
}
@media only screen and (max-width: 480px) {
li a { font-size:8px;}
}
@media only screen and (max-width: 320px) {
li a { font-size:5px; !important}
}<div id="header">
<div id="headerTitle">
<p>Project Archive</p>
</div>
<div id="nav">
<ul>
<li class="navOn"><a class="active" href="Home.php">Home</a></li>
<li><a href="Home.php">All</a></li>
<li><a href="Home.php">Categories</a></li>
<li><a href="Home.php">Quote</a></li>
<li><a href="Home.php">Support</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">Settings</a>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</li>
</ul>
</div>
</div>
<div id="search">
<p>Search Your Documents...</p>
<form action="Home.php" method="post">
<input type="text" name="search" placeholder="search" class="tbSearch">
</form>
</div>
<div id="documents">
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
答案 2 :(得分：0)
希望这是你想要的。
@charset "utf-8";
body{
background:#E8E8E8;
overflow-x:hidden;
}
#header{
width:100%;
min-height:80px;
font-weight:bold;
overflow:hidden;
}
#search{
height:115px;
background-color:#4C66A4;
color:#FFF;
text-align:center;
font-size:18px;
font-weight:bold;
padding-top:10px;
}
#navTop{
height:5px;
margin-bottom:20px;
background-color:#4C66A4;
}
#documents{
width:100%;
height:100%;
}
#docGrid{
height:225px;
margin-left:10%;
margin-right:10%;
margin-top:20px;
margin-bottom:20px;
}
#docLeft{
float:left;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docRight{
float:right;
height:222px;
width:45%;
background-color:#FFF;
border-bottom:3px solid #BEBEBE;
}
#docName{
text-align:center;
margin-top:10px;
margin-bottom:10px;
font-size:16px;
font-weight:bold;
}
#docDescription{
text-align:center;
margin-top:10px;
margin-bottom:10px;
margin-left:5px;
margin-right:5px;
height:110px;
}
#docOpen{
text-align:center;
margin-left:17.5%;
margin-right:17.5%;
margin-top:10px;
margin-bottom:10px;
}
#headerTitle{
float:left;
font-weight:bold;
font-size:20px;
text-align:center;
width:25%;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
font-size:12px;
min-height:80px;
}
.navOn{
border-top:3px solid #4C66A4;
height:47px;
padding-top:27px;
}
li {
width: 10%;
padding:30px 10px 0px 10px;
height:50px;
padding-top:30px;
text-align:center;
float:left;
}
a:visited {
text-decoration: none;
color:#000;
}
li a, .dropbtn {
display: inline-block;
color: #000;
text-align: center;
text-decoration: none;
}
li.dropdown {
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {
background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
display: block;
}
.btnOpen{
text-align:center;
vertical-align:middle;
height:30px;
width:100%;
border-radius:5px;
background-color:#4C66A4;
color:#FFF;
font-size:15px;
font-weight:bold;
}
.headerTitle{
font-size:20px;
text-align:center;
vertical-align:middle;
font-weight:bold;
}
.tbSearch{
border: 1px solid #848484;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
outline:0;
padding-left:10px;
padding-right:10px;
margin-top:0;
margin-bottom:0;
margin-left:12.5%;
margin-right:12.5%;
width:75%;
height:25px;
font-size:15px;
}
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {
}
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
}<body>
<div id="header">
<div id="headerTitle">
<p>Project Archive</p>
</div>
<div id="nav">
<ul>
<li class="navOn"><a class="active" href="Home.php">Home</a></li>
<li><a href="Home.php">All</a></li>
<li><a href="Home.php">Categories</a></li>
<li><a href="Home.php">Quote</a></li>
<li><a href="Home.php">Support</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">Settings</a>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</li>
</ul>
</div>
</div>
<div id="search">
<p>Search Your Documents...</p>
<form action="Home.php" method="post">
<input type="text" name="search" placeholder="search" class="tbSearch">
</form>
</div>
<div id="documents">
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="docGrid">
<div id="docLeft">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
<div id="docRight">
<div id="docName">
<p>Doc Name</p>
</div>
<div id="docDescription">
<p>This is the area where the description of the document will be displayed.</p>
</div>
<div id="docOpen">
<table class="btnOpen">
<tr>
<td>OPEN</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</body>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？