Div位置暂停内容

时间:2016-11-14 00:12:15

标签: html css position

我无法调整我的div,因此它不会将内容推到下面,不知何故,如果资产名称超过一行,它会将元数据描述向下推下一排,我尝试过定位和流程它似乎现在正在工作,有人可以看一看我做错了吗?

CSS

.port-container {
width: 490px;
height: 166px;
margin: 0px 0px 20px 0px;
float: left;
}

.port-container .port-image-link {
position: relative;
left: 10px;
}

.port-container .port-metadata-text {
padding: 50px 12px 10px 50px;
font-family: Arial, Helvetica, sans-serif;
color: #000;
font-size: 12px;  
position: absolute;
margin-top: -180px;
margin-left: 173px;
z-index: 8;
line-height: 17px;
}
.port-container .port-image-link .port-text-link {
cursor: pointer;
width: 220px;   
top: 138px;
position: relative;
text-decoration: none;
z-index: 9;
}

.port-container .port-image-link a {
text-decoration: none;
}

.port-container .port-image-link a span.port-text-link {
color: #fff;
font-family: Arial, Helvetica, sans-serif;
line-height: 17px;
position: relative;
top: -170px;
font-size: 12px;
text-decoration: none;
padding: 9px 50px 0px 0px;
font-weight: bold;
cursor: pointer;
left: 220px;
display: block;
}
.port-container .port-image-link a:hover span.port-text-link {
cursor: pointer;
text-decoration: underline;
}

HTML

<div class="port-container">    
<div class="port-image-link">
%asset_thumbnail%<a href="%asset_url%"><span class="port-text-link">%asset_name%</span></a>
<div class="port-metadata-text">%asset_metadata_DC.Description%</div>
</div>
</div>

0 个答案:

没有答案