无法将按钮定位在Google Map的右上方

时间:2019-01-09 01:27:09

标签: html css google-maps-api-3

我正在尝试在Google Map顶部放置一个按钮,但是我很难将按钮移到右上角(当前位于左上角)。我已经尝试了很多事情,但不确定正确的解决方案。

这是代码

<style>
.myButton {
    -moz-box-shadow: 0px 10px 14px -7px #4a398c;
    -webkit-box-shadow: 0px 10px 14px -7px #4a398c;
    box-shadow: 0px 10px 14px -7px #4a398c;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5e45ea), color-stop(1, #8667f7));
    background:-moz-linear-gradient(left, #5e45ea 5%, #8667f7 100%);
    background:-webkit-linear-gradient(left, #5e45ea 5%, #8667f7 100%);
    background:-o-linear-gradient(left, #5e45ea 5%, #8667f7 100%);
    background:-ms-linear-gradient(left, #5e45ea 5%, #8667f7 100%);
    background:linear-gradient(to left, #5e45ea 5%, #8667f7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5e45ea', endColorstr='#8667f7',GradientType=0);
    background-color:#5e45ea;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:14px;
    font-weight:bold;
    padding:8px 7px;
    text-decoration:none;
    text-shadow:0px 1px 0px #8667f7;
}
.myButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #8667f7), color-stop(1, #5e45ea));
    background:-moz-linear-gradient(top, #8667f7 5%, #5e45ea 100%);
    background:-webkit-linear-gradient(top, #8667f7 5%, #5e45ea 100%);
    background:-o-linear-gradient(top, #8667f7 5%, #5e45ea 100%);
    background:-ms-linear-gradient(top, #8667f7 5%, #5e45ea 100%);
    background:linear-gradient(to bottom, #8667f7 5%, #5e45ea 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8667f7', endColorstr='#5e45ea',GradientType=0);
    background-color:#8667f7;
}
.myButton:active {
    position:relative;
    top:1px;
}

   #over_map { position: absolute; top: 10px; left: 10px; z-index: 99; }
</style>

    <div id="over_map">
      <a href="logout.php" class="myButton">Logout</a>
   </div>

   <div id="map"></div>

As you can see the button is in the top left.

1 个答案:

答案 0 :(得分:-1)

尝试在left: 10px; CSS中使用#over_map