Question

我使用wordpress作为 CMS 完成了一个网页。我的客户要求我在页面的最顶部放置一个图像/按钮。与主导航菜单对齐。

没关系，我做到了，但发生了什么事：当我使用不同的屏幕分辨率时，按钮不会与页面顶部保持对齐

我已经尝试使用＆＃34; 位置：已修复＆＃34;，但是随之而来的是，按钮会随着页面一起移动而我希望它们保持在顶部页面，不要与页面一起滚动。

我该怎么做？有人能帮我吗？感谢!!!

＆＃13;

<?php echo $row_rsEnquiriesList['contact_date_e']; ?>

＆＃13;

.buttons {
  position: absolute;
left: 85%;
z-index:905;
margin-top:0
}
.buttonLang {
  position: relative;
z-index: 910;
     }
.buttonZone {
  position: relative;
z-index: 915;
top: -107px;
left: 100px;
}
.selectLang {
  display: none;
position: absolute;
left: 0;
bottom: 5px;
right: 0;
background-color: rgba(0,0,0,1);
}
#buttonLang:hover img {
  opacity: 1;
}
.dropdown {
  position: relative;
display: inline-block;
}
.dropdown-content {
  display: none;
position: absolute;
background-color: /*#2893CC;
*/#FFFFFF;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,1);
padding: 12px 16px;
z-index: 1;
font-family: Calibri;
    }
.dropdown:hover .dropdown-content {
  display: block;
line-height: 200%;
}

＆＃13;

Answer 1

请尝试使用position: absolute;。另外top: 0px;应该让它停留在那里。

Answer 2

body {position：relative;} .button {position：absolute;顶：0像素;左：10px的;}

Answer 3

将它们对齐而不是左对齐：）

.buttons {
    position: absolute;
    right: 10%; /* for example, adjust how you need */
    z-index:905;
    margin-top:0
}

Answer 4

将此添加到您的CSS：

.post > .post-content > .wpb_row > .wpb_column {
    position: static;
}
.buttons {
    position: absolute;
    right: 10%;
    top: 0;
    z-index: 905;
    margin-top: 0px;
}

但是我不明白你为什么不把按钮HTML移到标题中。当您调整浏览器大小时，按钮会与导航重叠，只需几行CSS就无法纠正。

如何将图像对齐到页面的上边距

4 个答案: